graficas highcharts

APP/components/Charts/config_plots.js

@@ -0,0 +1,83 @@
+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(0,0,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} %'
+        }
+    }
+},
+};