191 lines
3.8 KiB
JavaScript
191 lines
3.8 KiB
JavaScript
export var chartOptions = {
|
|
credits: {
|
|
enabled: false
|
|
},
|
|
chart: {
|
|
renderTo: "container",
|
|
defaultSeriesType: "column",
|
|
backgroundColor: "rgba(0,0,0,0)"
|
|
},
|
|
|
|
xAxis: {
|
|
categories: [],
|
|
crosshair: true
|
|
},
|
|
yAxis: {
|
|
title: {
|
|
text: ""
|
|
},
|
|
labels: {
|
|
style: {
|
|
color: "#d4d2d2",
|
|
font: "11px Trebuchet MS, Verdana, sans-serif"
|
|
}
|
|
}
|
|
},
|
|
|
|
legend: {
|
|
itemStyle: {
|
|
color: "#d4d2d2"
|
|
}
|
|
},
|
|
tooltip: {
|
|
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
|
|
pointFormat:
|
|
'<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
|
|
'<td style="padding:0"><b>{point.y:.0f} pesos</b></td></tr>',
|
|
footerFormat: "</table>",
|
|
shared: true,
|
|
useHTML: true
|
|
},
|
|
responsive: {
|
|
rules: [
|
|
{
|
|
condition: {
|
|
maxWidth: 500
|
|
},
|
|
chartOptions: {
|
|
legend: {
|
|
layout: "horizontal",
|
|
align: "center",
|
|
verticalAlign: "bottom"
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}
|
|
};
|
|
|
|
export var pieOptions={
|
|
chart: {
|
|
renderTo: "container",
|
|
defaultSeriesType: "pie",
|
|
//backgroundColor: "rgba(255,0,0,)"
|
|
},
|
|
xAxis: {
|
|
categories: [],
|
|
crosshair: true
|
|
|
|
},
|
|
credits: {
|
|
enabled: false
|
|
},
|
|
plotOptions: {
|
|
pie: {
|
|
allowPointSelect: true,
|
|
cursor: 'pointer',
|
|
dataLabels: {
|
|
enabled: true,
|
|
format: '<b>{point.name}</b>: {point.percentage:.1f} %'
|
|
}
|
|
}
|
|
},
|
|
};
|
|
|
|
export var ingresosvscomprasOptions = {
|
|
chart: {
|
|
renderTo: "container",
|
|
defaultSeriesType: "bar",
|
|
backgroundColor: "rgba(0,0,0,0)"
|
|
},
|
|
title: {
|
|
text: "Gastos Vs Ingresos"
|
|
},
|
|
plotOptions: {
|
|
bar: {
|
|
grouping: false,
|
|
shadow: false,
|
|
borderWidth: 0.5
|
|
},
|
|
},
|
|
legend: {
|
|
shadow: true
|
|
},
|
|
|
|
credits: {
|
|
enabled: false
|
|
},
|
|
xAxis: {
|
|
categories: [""],
|
|
crosshair: false
|
|
},
|
|
yAxis: [
|
|
{
|
|
min: 0,
|
|
title: {
|
|
text: "Pesos"
|
|
}
|
|
}
|
|
],
|
|
series: [
|
|
{
|
|
name: "Ingresos",
|
|
|
|
color: "rgba(0,80,200,.5)",
|
|
data: [150],
|
|
pointPadding: 0.25,
|
|
pointPlacement: -0.2
|
|
},
|
|
{
|
|
name: "Gastos",
|
|
color: "rgba(165,0,217,1)",
|
|
data: [120],
|
|
pointPadding: 0.3,
|
|
pointPlacement: -0.2
|
|
}
|
|
]
|
|
};
|
|
|
|
export var ingresosvsegresosOptions = {
|
|
chart: {
|
|
renderTo: "container",
|
|
defaultSeriesType: "bar",
|
|
backgroundColor: "rgba(0,0,0,0)"
|
|
},
|
|
title: {
|
|
text: ""
|
|
},
|
|
plotOptions: {
|
|
bar: {
|
|
grouping: false,
|
|
shadow: false,
|
|
borderWidth: 0.5
|
|
},
|
|
},
|
|
legend: {
|
|
shadow: false
|
|
},
|
|
|
|
credits: {
|
|
enabled: false
|
|
},
|
|
xAxis: {
|
|
categories: [""],
|
|
crosshair: false
|
|
},
|
|
yAxis: [
|
|
{
|
|
min: 0,
|
|
title: {
|
|
text: "Pesos"
|
|
}
|
|
}
|
|
],
|
|
series: [
|
|
{
|
|
name: "Ingresos",
|
|
|
|
color: "rgba(0,80,200,.5)",
|
|
data: [],
|
|
pointPadding: 0.25,
|
|
pointPlacement: -0.2
|
|
},
|
|
{
|
|
name: "Egresos",
|
|
color: "rgba(165,0,217,1)",
|
|
data: [],
|
|
pointPadding: 0.3,
|
|
pointPlacement: -0.2
|
|
}
|
|
]
|
|
}; |