chartkick 2.3.5 → 3.3.0

data/vendor/assets/javascripts/chartkick.js

@@ -2,14 +2,14 @@
  * Chartkick.js
  * Create beautiful charts with one line of JavaScript
  * https://github.com/ankane/chartkick.js
- * v2.3.6
+ * v3.2.0
  * MIT License
  */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
   typeof define === 'function' && define.amd ? define(factory) :
-  (global.Chartkick = factory());
+  (global = global || self, global.Chartkick = factory());
 }(this, (function () { 'use strict';
 
   function isArray(variable) {
@@ -21,13 +21,17 @@
   }
 
   function isPlainObject(variable) {
-    return !isFunction(variable) && variable instanceof Object;
+    // protect against prototype pollution, defense 2
+    return Object.prototype.toString.call(variable) === "[object Object]" && !isFunction(variable) && variable instanceof Object;
   }
 
   // https://github.com/madrobby/zepto/blob/master/src/zepto.js
   function extend(target, source) {
     var key;
     for (key in source) {
+      // protect against prototype pollution, defense 1
+      if (key === "__proto__") { continue; }
+
       if (isPlainObject(source[key]) || isArray(source[key])) {
         if (isPlainObject(source[key]) && !isPlainObject(target[key])) {
           target[key] = {};
@@ -233,7 +237,11 @@
     return !isNaN(toDate(obj)) && toStr(obj).length >= 6;
   }
 
-  function formatValue(pre, value, options) {
+  function isNumber(obj) {
+    return typeof obj === "number";
+  }
+
+  function formatValue(pre, value, options, axis) {
     pre = pre || "";
     if (options.prefix) {
       if (value < 0) {
@@ -243,6 +251,58 @@
       pre += options.prefix;
     }
 
+    var suffix = options.suffix || "";
+    var precision = options.precision;
+    var round = options.round;
+
+    if (options.byteScale) {
+      var baseValue = axis ? options.byteScale : value;
+      if (baseValue >= 1099511627776) {
+        value /= 1099511627776;
+        suffix = " TB";
+      } else if (baseValue >= 1073741824) {
+        value /= 1073741824;
+        suffix = " GB";
+      } else if (baseValue >= 1048576) {
+        value /= 1048576;
+        suffix = " MB";
+      } else if (baseValue >= 1024) {
+        value /= 1024;
+        suffix = " KB";
+      } else {
+        suffix = " bytes";
+      }
+
+      if (precision === undefined && round === undefined) {
+        precision = 3;
+      }
+    }
+
+    if (precision !== undefined && round !== undefined) {
+      throw Error("Use either round or precision, not both");
+    }
+
+    if (!axis) {
+      if (precision !== undefined) {
+        value = value.toPrecision(precision);
+        if (!options.zeros) {
+          value = parseFloat(value);
+        }
+      }
+
+      if (round !== undefined) {
+        if (round < 0) {
+          var num = Math.pow(10, -1 * round);
+          value = parseInt((1.0 * value / num).toFixed(0)) * num;
+        } else {
+          value = value.toFixed(round);
+          if (!options.zeros) {
+            value = parseFloat(value);
+          }
+        }
+      }
+    }
+
     if (options.thousands || options.decimal) {
       value = toStr(value);
       var parts = value.split(".");
@@ -255,7 +315,16 @@
       }
     }
 
-    return pre + value + (options.suffix || "");
+    return pre + value + suffix;
+  }
+
+  function seriesOption(chart, series, option) {
+    if (option in series) {
+      return series[option];
+    } else if (option in chart.options) {
+      return chart.options[option];
+    }
+    return null;
   }
 
   function allZeros(data) {
@@ -371,25 +440,35 @@
     options.scales.yAxes[0].scaleLabel.labelString = title;
   };
 
-  // http://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb
+  // https://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb
   var addOpacity = function(hex, opacity) {
     var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
     return result ? "rgba(" + parseInt(result[1], 16) + ", " + parseInt(result[2], 16) + ", " + parseInt(result[3], 16) + ", " + opacity + ")" : hex;
   };
 
+  // check if not null or undefined
+  // https://stackoverflow.com/a/27757708/1177228
+  var notnull = function(x) {
+    return x != null;
+  };
+
   var setLabelSize = function (chart, data, options) {
     var maxLabelSize = Math.ceil(chart.element.offsetWidth / 4.0 / data.labels.length);
     if (maxLabelSize > 25) {
       maxLabelSize = 25;
+    } else if (maxLabelSize < 10) {
+      maxLabelSize = 10;
+    }
+    if (!options.scales.xAxes[0].ticks.callback) {
+      options.scales.xAxes[0].ticks.callback = function (value) {
+        value = toStr(value);
+        if (value.length > maxLabelSize) {
+          return value.substring(0, maxLabelSize - 2) + "...";
+        } else {
+          return value;
+        }
+      };
     }
-    options.scales.xAxes[0].ticks.callback = function (value) {
-      value = toStr(value);
-      if (value.length > maxLabelSize) {
-        return value.substring(0, maxLabelSize - 2) + "...";
-      } else {
-        return value;
-      }
-    };
   };
 
   var setFormatOptions = function(chart, options, chartType) {
@@ -397,58 +476,113 @@
       prefix: chart.options.prefix,
       suffix: chart.options.suffix,
       thousands: chart.options.thousands,
-      decimal: chart.options.decimal
+      decimal: chart.options.decimal,
+      precision: chart.options.precision,
+      round: chart.options.round,
+      zeros: chart.options.zeros
     };
 
-    if (formatOptions.prefix || formatOptions.suffix || formatOptions.thousands || formatOptions.decimal) {
-      if (chartType !== "pie") {
-        var myAxes = options.scales.yAxes;
-        if (chartType === "bar") {
-          myAxes = options.scales.xAxes;
-        }
+    if (chart.options.bytes) {
+      var series = chart.data;
+      if (chartType === "pie") {
+        series = [{data: series}];
+      }
 
-        if (!myAxes[0].ticks.callback) {
-          myAxes[0].ticks.callback = function (value) {
-            return formatValue("", value, formatOptions);
-          };
+      // calculate max
+      var max = 0;
+      for (var i = 0; i < series.length; i++) {
+        var s = series[i];
+        for (var j = 0; j < s.data.length; j++) {
+          if (s.data[j][1] > max) {
+            max = s.data[j][1];
+          }
         }
       }
 
-      if (!options.tooltips.callbacks.label) {
-        if (chartType !== "pie") {
-          var valueLabel = chartType === "bar" ? "xLabel" : "yLabel";
-          options.tooltips.callbacks.label = function (tooltipItem, data) {
-            var label = data.datasets[tooltipItem.datasetIndex].label || '';
-            if (label) {
-              label += ': ';
-            }
-            return formatValue(label, tooltipItem[valueLabel], formatOptions);
-          };
-        } else {
-          // need to use separate label for pie charts
-          options.tooltips.callbacks.label = function (tooltipItem, data) {
-            var dataLabel = data.labels[tooltipItem.index];
-            var value = ': ';
-
-            if (isArray(dataLabel)) {
-              // show value on first line of multiline label
-              // need to clone because we are changing the value
-              dataLabel = dataLabel.slice();
-              dataLabel[0] += value;
-            } else {
-              dataLabel += value;
-            }
+      // calculate scale
+      var scale = 1;
+      while (max >= 1024) {
+        scale *= 1024;
+        max /= 1024;
+      }
 
-            return formatValue(dataLabel, data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index], formatOptions);
-          };
+      // set step size
+      formatOptions.byteScale = scale;
+    }
+
+    if (chartType !== "pie") {
+      var myAxes = options.scales.yAxes;
+      if (chartType === "bar") {
+        myAxes = options.scales.xAxes;
+      }
+
+      if (formatOptions.byteScale) {
+        if (!myAxes[0].ticks.stepSize) {
+          myAxes[0].ticks.stepSize = formatOptions.byteScale / 2;
+        }
+        if (!myAxes[0].ticks.maxTicksLimit) {
+          myAxes[0].ticks.maxTicksLimit = 4;
         }
       }
+
+      if (!myAxes[0].ticks.callback) {
+        myAxes[0].ticks.callback = function (value) {
+          return formatValue("", value, formatOptions, true);
+        };
+      }
+    }
+
+    if (!options.tooltips.callbacks.label) {
+      if (chartType === "scatter") {
+        options.tooltips.callbacks.label = function (item, data) {
+          var label = data.datasets[item.datasetIndex].label || '';
+          if (label) {
+            label += ': ';
+          }
+          return label + '(' + item.xLabel + ', ' + item.yLabel + ')';
+        };
+      } else if (chartType === "bubble") {
+        options.tooltips.callbacks.label = function (item, data) {
+          var label = data.datasets[item.datasetIndex].label || '';
+          if (label) {
+            label += ': ';
+          }
+          var dataPoint = data.datasets[item.datasetIndex].data[item.index];
+          return label + '(' + item.xLabel + ', ' + item.yLabel + ', ' + dataPoint.v + ')';
+        };
+      } else if (chartType === "pie") {
+        // need to use separate label for pie charts
+        options.tooltips.callbacks.label = function (tooltipItem, data) {
+          var dataLabel = data.labels[tooltipItem.index];
+          var value = ': ';
+
+          if (isArray(dataLabel)) {
+            // show value on first line of multiline label
+            // need to clone because we are changing the value
+            dataLabel = dataLabel.slice();
+            dataLabel[0] += value;
+          } else {
+            dataLabel += value;
+          }
+
+          return formatValue(dataLabel, data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index], formatOptions);
+        };
+      } else {
+        var valueLabel = chartType === "bar" ? "xLabel" : "yLabel";
+        options.tooltips.callbacks.label = function (tooltipItem, data) {
+          var label = data.datasets[tooltipItem.datasetIndex].label || '';
+          if (label) {
+            label += ': ';
+          }
+          return formatValue(label, tooltipItem[valueLabel], formatOptions);
+        };
+      }
     }
   };
 
   var jsOptions = jsOptionsFunc(merge(baseOptions, defaultOptions), hideLegend, setTitle, setMin, setMax, setStacked, setXtitle, setYtitle);
 
-  var createDataTable = function (chart, options, chartType) {
+  var createDataTable = function (chart, options, chartType, library) {
     var datasets = [];
     var labels = [];
 
@@ -461,61 +595,92 @@
     var year = true;
     var hour = true;
     var minute = true;
-    var detectType = (chartType === "line" || chartType === "area") && !chart.discrete;
 
     var series = chart.data;
 
-    var sortedLabels = [];
-
-    var i, j, s, d, key, rows = [];
-    for (i = 0; i < series.length; i++) {
-      s = series[i];
-
-      for (j = 0; j < s.data.length; j++) {
-        d = s.data[j];
-        key = detectType ? d[0].getTime() : d[0];
-        if (!rows[key]) {
-          rows[key] = new Array(series.length);
-        }
-        rows[key][i] = toFloat(d[1]);
-        if (sortedLabels.indexOf(key) === -1) {
-          sortedLabels.push(key);
+    var max = 0;
+    if (chartType === "bubble") {
+      for (var i$1 = 0; i$1 < series.length; i$1++) {
+        var s$1 = series[i$1];
+        for (var j$1 = 0; j$1 < s$1.data.length; j$1++) {
+          if (s$1.data[j$1][2] > max) {
+            max = s$1.data[j$1][2];
+          }
         }
       }
     }
 
-    if (detectType || chart.options.xtype === "number") {
-      sortedLabels.sort(sortByNumber);
-    }
+    var i, j, s, d, key, rows = [], rows2 = [];
 
-    var rows2 = [];
-    for (j = 0; j < series.length; j++) {
-      rows2.push([]);
-    }
+    if (chartType === "bar" || chartType === "column" || (chart.xtype !== "number" && chart.xtype !== "bubble")) {
+      var sortedLabels = [];
 
-    var value;
-    var k;
-    for (k = 0; k < sortedLabels.length; k++) {
-      i = sortedLabels[k];
-      if (detectType) {
-        value = new Date(toFloat(i));
-        // TODO make this efficient
-        day = day && isDay(value);
-        if (!dayOfWeek) {
-          dayOfWeek = value.getDay();
+      for (i = 0; i < series.length; i++) {
+        s = series[i];
+
+        for (j = 0; j < s.data.length; j++) {
+          d = s.data[j];
+          key = chart.xtype == "datetime" ? d[0].getTime() : d[0];
+          if (!rows[key]) {
+            rows[key] = new Array(series.length);
+          }
+          rows[key][i] = toFloat(d[1]);
+          if (sortedLabels.indexOf(key) === -1) {
+            sortedLabels.push(key);
+          }
         }
-        week = week && isWeek(value, dayOfWeek);
-        month = month && isMonth(value);
-        year = year && isYear(value);
-        hour = hour && isHour(value);
-        minute = minute && isMinute(value);
-      } else {
-        value = i;
       }
-      labels.push(value);
+
+      if (chart.xtype === "datetime" || chart.xtype === "number") {
+        sortedLabels.sort(sortByNumber);
+      }
+
       for (j = 0; j < series.length; j++) {
-        // Chart.js doesn't like undefined
-        rows2[j].push(rows[i][j] === undefined ? null : rows[i][j]);
+        rows2.push([]);
+      }
+
+      var value;
+      var k;
+      for (k = 0; k < sortedLabels.length; k++) {
+        i = sortedLabels[k];
+        if (chart.xtype === "datetime") {
+          value = new Date(toFloat(i));
+          // TODO make this efficient
+          day = day && isDay(value);
+          if (!dayOfWeek) {
+            dayOfWeek = value.getDay();
+          }
+          week = week && isWeek(value, dayOfWeek);
+          month = month && isMonth(value);
+          year = year && isYear(value);
+          hour = hour && isHour(value);
+          minute = minute && isMinute(value);
+        } else {
+          value = i;
+        }
+        labels.push(value);
+        for (j = 0; j < series.length; j++) {
+          // Chart.js doesn't like undefined
+          rows2[j].push(rows[i][j] === undefined ? null : rows[i][j]);
+        }
+      }
+    } else {
+      for (var i$2 = 0; i$2 < series.length; i$2++) {
+        var s$2 = series[i$2];
+        var d$1 = [];
+        for (var j$2 = 0; j$2 < s$2.data.length; j$2++) {
+          var point = {
+            x: toFloat(s$2.data[j$2][0]),
+            y: toFloat(s$2.data[j$2][1])
+          };
+          if (chartType === "bubble") {
+            point.r = toFloat(s$2.data[j$2][2]) * 20 / max;
+            // custom attribute, for tooltip
+            point.v = s$2.data[j$2][2];
+          }
+          d$1.push(point);
+        }
+        rows2.push(d$1);
       }
     }
 
@@ -526,25 +691,27 @@
       var backgroundColor = chartType !== "line" ? addOpacity(color, 0.5) : color;
 
       var dataset = {
-        label: s.name,
+        label: s.name || "",
         data: rows2[i],
         fill: chartType === "area",
         borderColor: color,
         backgroundColor: backgroundColor,
         pointBackgroundColor: color,
-        pointHoverBackgroundColor: color,
-        borderWidth: 2
+        borderWidth: 2,
+        pointHoverBackgroundColor: color
       };
 
       if (s.stack) {
         dataset.stack = s.stack;
       }
 
-      if (chart.options.curve === false) {
+      var curve = seriesOption(chart, s, "curve");
+      if (curve === false) {
         dataset.lineTension = 0;
       }
 
-      if (chart.options.points === false) {
+      var points = seriesOption(chart, s, "points");
+      if (points === false) {
         dataset.pointRadius = 0;
         dataset.pointHitRadius = 5;
       }
@@ -556,16 +723,40 @@
       datasets.push(dataset);
     }
 
-    if (detectType && labels.length > 0) {
-      var minTime = labels[0].getTime();
-      var maxTime = labels[0].getTime();
+    var xmin = chart.options.xmin;
+    var xmax = chart.options.xmax;
+
+    if (chart.xtype === "datetime") {
+      // hacky check for Chart.js >= 2.9.0
+      // https://github.com/chartjs/Chart.js/compare/v2.8.0...v2.9.0
+      var gte29 = "math" in library.helpers;
+      var ticksKey = gte29 ? "ticks" : "time";
+      if (notnull(xmin)) {
+        options.scales.xAxes[0][ticksKey].min = toDate(xmin).getTime();
+      }
+      if (notnull(xmax)) {
+        options.scales.xAxes[0][ticksKey].max = toDate(xmax).getTime();
+      }
+    } else if (chart.xtype === "number") {
+      if (notnull(xmin)) {
+        options.scales.xAxes[0].ticks.min = xmin;
+      }
+      if (notnull(xmax)) {
+        options.scales.xAxes[0].ticks.max = xmax;
+      }
+    }
+
+    if (chart.xtype === "datetime" && labels.length > 0) {
+      var minTime = (notnull(xmin) ? toDate(xmin) : labels[0]).getTime();
+      var maxTime = (notnull(xmax) ? toDate(xmax) : labels[0]).getTime();
+
       for (i = 1; i < labels.length; i++) {
-        value = labels[i].getTime();
-        if (value < minTime) {
-          minTime = value;
+        var value$1 = labels[i].getTime();
+        if (value$1 < minTime) {
+          minTime = value$1;
         }
-        if (value > maxTime) {
-          maxTime = value;
+        if (value$1 > maxTime) {
+          maxTime = value$1;
         }
       }
 
@@ -626,10 +817,6 @@
   };
 
   defaultExport.prototype.renderLineChart = function renderLineChart (chart, chartType) {
-    if (chart.options.xtype === "number") {
-      return this.renderScatterChart(chart, chartType, true);
-    }
-
     var chartOptions = {};
     // fix for https://github.com/chartjs/Chart.js/issues/2441
     if (!chart.options.max && allZeros(chart.data)) {
@@ -639,9 +826,14 @@
     var options = jsOptions(chart, merge(chartOptions, chart.options));
     setFormatOptions(chart, options, chartType);
 
-    var data = createDataTable(chart, options, chartType || "line");
+    var data = createDataTable(chart, options, chartType || "line", this.library);
 
-    options.scales.xAxes[0].type = chart.discrete ? "category" : "time";
+    if (chart.xtype === "number") {
+      options.scales.xAxes[0].type = "linear";
+      options.scales.xAxes[0].position = "bottom";
+    } else {
+      options.scales.xAxes[0].type = chart.xtype === "string" ? "category" : "time";
+    }
 
     this.drawChart(chart, "line", data, options);
   };
@@ -688,12 +880,14 @@
   defaultExport.prototype.renderColumnChart = function renderColumnChart (chart, chartType) {
     var options;
     if (chartType === "bar") {
-      options = jsOptionsFunc(merge(baseOptions, defaultOptions), hideLegend, setTitle, setBarMin, setBarMax, setStacked, setXtitle, setYtitle)(chart, chart.options);
+      var barOptions = merge(baseOptions, defaultOptions);
+      delete barOptions.scales.yAxes[0].ticks.maxTicksLimit;
+      options = jsOptionsFunc(barOptions, hideLegend, setTitle, setBarMin, setBarMax, setStacked, setXtitle, setYtitle)(chart, chart.options);
     } else {
       options = jsOptions(chart, chart.options);
     }
     setFormatOptions(chart, options, chartType);
-    var data = createDataTable(chart, options, "column");
+    var data = createDataTable(chart, options, "column", this.library);
     if (chartType !== "bar") {
       setLabelSize(chart, data, options);
     }
@@ -708,51 +902,17 @@
     this.renderColumnChart(chart, "bar");
   };
 
-  defaultExport.prototype.renderScatterChart = function renderScatterChart (chart, chartType, lineChart) {
-    chartType = chartType || "line";
+  defaultExport.prototype.renderScatterChart = function renderScatterChart (chart, chartType) {
+    chartType = chartType || "scatter";
 
     var options = jsOptions(chart, chart.options);
-    if (!lineChart) {
-      setFormatOptions(chart, options, chartType);
-    }
-
-    var colors = chart.options.colors || defaultColors;
-
-    var datasets = [];
-    var series = chart.data;
-    for (var i = 0; i < series.length; i++) {
-      var s = series[i];
-      var d = [];
-      for (var j = 0; j < s.data.length; j++) {
-        var point = {
-          x: toFloat(s.data[j][0]),
-          y: toFloat(s.data[j][1])
-        };
-        if (chartType === "bubble") {
-          point.r = toFloat(s.data[j][2]);
-        }
-        d.push(point);
-      }
-
-      var color = s.color || colors[i];
-      var backgroundColor = chartType === "area" ? addOpacity(color, 0.5) : color;
-
-      datasets.push({
-        label: s.name,
-        showLine: lineChart || false,
-        data: d,
-        borderColor: color,
-        backgroundColor: backgroundColor,
-        pointBackgroundColor: color,
-        fill: chartType === "area"
-      });
-    }
+    setFormatOptions(chart, options, chartType);
 
-    if (chartType === "area") {
-      chartType = "line";
+    if (!("showLines" in options)) {
+      options.showLines = false;
     }
 
-    var data = {datasets: datasets};
+    var data = createDataTable(chart, options, chartType, this.library);
 
     options.scales.xAxes[0].type = "linear";
     options.scales.xAxes[0].position = "bottom";
@@ -773,13 +933,19 @@
   defaultExport.prototype.drawChart = function drawChart (chart, type, data, options) {
     this.destroy(chart);
 
-    chart.element.innerHTML = "<canvas></canvas>";
-    var ctx = chart.element.getElementsByTagName("CANVAS")[0];
-    chart.chart = new this.library(ctx, {
+    var chartOptions = {
       type: type,
       data: data,
       options: options
-    });
+    };
+
+    if (chart.options.code) {
+      window.console.log("new Chart(ctx, " + JSON.stringify(chartOptions) + ");");
+    }
+
+    chart.element.innerHTML = "<canvas></canvas>";
+    var ctx = chart.element.getElementsByTagName("CANVAS")[0];
+    chart.chart = new this.library(ctx, chartOptions);
   };
 
   var defaultOptions$1 = {
@@ -820,6 +986,7 @@
     },
     plotOptions: {
       areaspline: {},
+      area: {},
       series: {
         marker: {}
       }
@@ -856,7 +1023,10 @@
   };
 
   var setStacked$1 = function (options, stacked) {
-    options.plotOptions.series.stacking = stacked ? (stacked === true ? "normal" : stacked) : null;
+    var stackedValue = stacked ? (stacked === true ? "normal" : stacked) : null;
+    options.plotOptions.series.stacking = stackedValue;
+    options.plotOptions.area.stacking = stackedValue;
+    options.plotOptions.areaspline.stacking = stackedValue;
   };
 
   var setXtitle$1 = function (options, title) {
@@ -874,21 +1044,22 @@
       prefix: chart.options.prefix,
       suffix: chart.options.suffix,
       thousands: chart.options.thousands,
-      decimal: chart.options.decimal
+      decimal: chart.options.decimal,
+      precision: chart.options.precision,
+      round: chart.options.round,
+      zeros: chart.options.zeros
     };
 
-    if (formatOptions.prefix || formatOptions.suffix || formatOptions.thousands || formatOptions.decimal) {
-      if (chartType !== "pie" && !options.yAxis.labels.formatter) {
-        options.yAxis.labels.formatter = function () {
-          return formatValue("", this.value, formatOptions);
-        };
-      }
+    if (chartType !== "pie" && !options.yAxis.labels.formatter) {
+      options.yAxis.labels.formatter = function () {
+        return formatValue("", this.value, formatOptions);
+      };
+    }
 
-      if (!options.tooltip.pointFormatter) {
-        options.tooltip.pointFormatter = function () {
-          return '<span style="color:' + this.color + '>\u25CF</span> ' + formatValue(this.series.name + ': <b>', this.y, formatOptions) + '</b><br/>';
-        };
-      }
+    if (!options.tooltip.pointFormatter) {
+      options.tooltip.pointFormatter = function () {
+        return '<span style="color:' + this.color + '">\u25CF</span> ' + formatValue(this.series.name + ': <b>', this.y, formatOptions) + '</b><br/>';
+      };
     }
   };
 
@@ -927,7 +1098,7 @@
     }
 
     var options = jsOptions$1(chart, chart.options, chartOptions), data, i, j;
-    options.xAxis.type = chart.discrete ? "category" : "datetime";
+    options.xAxis.type = chart.xtype === "string" ? "category" : (chart.xtype === "number" ? "linear" : "datetime");
     if (!options.chart.type) {
       options.chart.type = chartType;
     }
@@ -935,8 +1106,9 @@
 
     var series = chart.data;
     for (i = 0; i < series.length; i++) {
+      series[i].name = series[i].name || "Value";
       data = series[i].data;
-      if (!chart.discrete) {
+      if (chart.xtype === "datetime") {
         for (j = 0; j < data.length; j++) {
           data[j][0] = data[j][0].getTime();
         }
@@ -1005,7 +1177,7 @@
       }
     }
 
-    if (chart.options.xtype === "number") {
+    if (chart.xtype === "number") {
       categories.sort(sortByNumber);
     }
 
@@ -1019,7 +1191,7 @@
       }
 
       d2 = {
-        name: series[i].name,
+        name: series[i].name || "Value",
         data: d
       };
       if (series[i].stack) {
@@ -1051,6 +1223,11 @@
 
     options.chart.renderTo = chart.element.id;
     options.series = data;
+
+    if (chart.options.code) {
+      window.console.log("new Highcharts.Chart(" + JSON.stringify(options) + ");");
+    }
+
     chart.chart = new this.library.Chart(options);
   };
 
@@ -1182,13 +1359,9 @@
       }
 
       var options = jsOptions$2(chart, chart.options, chartOptions);
-      var columnType = chart.discrete ? "string" : "datetime";
-      if (chart.options.xtype === "number") {
-        columnType = "number";
-      }
-      var data = this$1.createDataTable(chart.data, columnType);
+      var data = this$1.createDataTable(chart.data, chart.xtype);
 
-      this$1.drawChart(chart, this$1.library.visualization.LineChart, data, options);
+      this$1.drawChart(chart, "LineChart", data, options);
     });
   };
 
@@ -1222,7 +1395,7 @@
       data.addColumn("number", "Value");
       data.addRows(chart.data);
 
-      this$1.drawChart(chart, this$1.library.visualization.PieChart, data, options);
+      this$1.drawChart(chart, "PieChart", data, options);
     });
   };
 
@@ -1231,9 +1404,9 @@
 
     this.waitForLoaded(chart, function () {
       var options = jsOptions$2(chart, chart.options);
-      var data = this$1.createDataTable(chart.data, "string", chart.options.xtype);
+      var data = this$1.createDataTable(chart.data, chart.xtype);
 
-      this$1.drawChart(chart, this$1.library.visualization.ColumnChart, data, options);
+      this$1.drawChart(chart, "ColumnChart", data, options);
     });
   };
 
@@ -1249,9 +1422,9 @@
         }
       };
       var options = jsOptionsFunc(defaultOptions$2, hideLegend$2, setTitle$2, setBarMin$1, setBarMax$1, setStacked$2, setXtitle$2, setYtitle$2)(chart, chart.options, chartOptions);
-      var data = this$1.createDataTable(chart.data, "string", chart.options.xtype);
+      var data = this$1.createDataTable(chart.data, chart.xtype);
 
-      this$1.drawChart(chart, this$1.library.visualization.BarChart, data, options);
+      this$1.drawChart(chart, "BarChart", data, options);
     });
   };
 
@@ -1266,13 +1439,9 @@
       };
 
       var options = jsOptions$2(chart, chart.options, chartOptions);
-      var columnType = chart.discrete ? "string" : "datetime";
-      if (chart.options.xtype === "number") {
-        columnType = "number";
-      }
-      var data = this$1.createDataTable(chart.data, columnType);
+      var data = this$1.createDataTable(chart.data, chart.xtype);
 
-      this$1.drawChart(chart, this$1.library.visualization.AreaChart, data, options);
+      this$1.drawChart(chart, "AreaChart", data, options);
     });
   };
 
@@ -1293,7 +1462,7 @@
       data.addColumn("number", chart.options.label || "Value");
       data.addRows(chart.data);
 
-      this$1.drawChart(chart, this$1.library.visualization.GeoChart, data, options);
+      this$1.drawChart(chart, "GeoChart", data, options);
     });
   };
 
@@ -1306,6 +1475,7 @@
 
       var series = chart.data, rows2 = [], i, j, data, d;
       for (i = 0; i < series.length; i++) {
+        series[i].name = series[i].name || "Value";
         d = series[i].data;
         for (j = 0; j < d.length; j++) {
           var row = new Array(series.length + 1);
@@ -1322,7 +1492,7 @@
       }
       data.addRows(rows2);
 
-      this$1.drawChart(chart, this$1.library.visualization.ScatterChart, data, options);
+      this$1.drawChart(chart, "ScatterChart", data, options);
     });
   };
 
@@ -1347,7 +1517,7 @@
 
       chart.element.style.lineHeight = "normal";
 
-      this$1.drawChart(chart, this$1.library.visualization.Timeline, data, options);
+      this$1.drawChart(chart, "Timeline", data, options);
     });
   };
 
@@ -1360,7 +1530,11 @@
   defaultExport$2.prototype.drawChart = function drawChart (chart, type, data, options) {
     this.destroy(chart);
 
-    chart.chart = new type(chart.element);
+    if (chart.options.code) {
+      window.console.log("var data = new google.visualization.DataTable(" + data.toJSON() + ");\nvar chart = new google.visualization." + type + "(element);\nchart.draw(data, " + JSON.stringify(options) + ");");
+    }
+
+    chart.chart = new this.library.visualization[type](chart.element);
     resize(function () {
       chart.chart.draw(data, options);
     });
@@ -1394,21 +1568,15 @@
         loadOptions.mapsApiKey = config.mapsApiKey;
       }
 
-      if (this.library.setOnLoadCallback) {
-        this.library.load("visualization", "1", loadOptions);
-      } else {
-        this.library.charts.load("current", loadOptions);
-      }
+      this.library.charts.load("current", loadOptions);
     }
   };
 
   defaultExport$2.prototype.runCallbacks = function runCallbacks () {
-      var this$1 = this;
-
     var cb, call;
     for (var i = 0; i < callbacks.length; i++) {
       cb = callbacks[i];
-      call = this$1.library.visualization && ((cb.pack === "corechart" && this$1.library.visualization.LineChart) || (cb.pack === "timeline" && this$1.library.visualization.Timeline));
+      call = this.library.visualization && ((cb.pack === "corechart" && this.library.visualization.LineChart) || (cb.pack === "timeline" && this.library.visualization.Timeline));
       if (call) {
         cb.callback();
         callbacks.splice(i, 1);
@@ -1418,10 +1586,11 @@
   };
 
   // cant use object as key
-  defaultExport$2.prototype.createDataTable = function createDataTable (series, columnType, xtype) {
+  defaultExport$2.prototype.createDataTable = function createDataTable (series, columnType) {
     var i, j, s, d, key, rows = [], sortedLabels = [];
     for (i = 0; i < series.length; i++) {
       s = series[i];
+      series[i].name = series[i].name || "Value";
 
       for (j = 0; j < s.data.length; j++) {
         d = s.data[j];
@@ -1453,14 +1622,12 @@
       rows2.sort(sortByTime);
     } else if (columnType === "number") {
       rows2.sort(sortByNumberSeries);
-    }
-
-    if (xtype === "number") {
-      rows2.sort(sortByNumberSeries);
 
       for (i = 0; i < rows2.length; i++) {
         rows2[i][0] = toStr(rows2[i][0]);
       }
+
+      columnType = "string";
     }
 
     // create datatable
@@ -1508,7 +1675,7 @@
   function ajaxCall(url, success, error) {
     var $ = window.jQuery || window.Zepto || window.$;
 
-    if ($) {
+    if ($ && $.ajax) {
       $.ajax({
         dataType: "json",
         url: url,
@@ -1532,7 +1699,7 @@
     }
   }
 
-  var config = (typeof window !== "undefined" && window.Chartkick) || {};
+  var config = {};
   var adapters = [];
 
   // helpers
@@ -1545,8 +1712,12 @@
     }
   }
 
-  function chartError(element, message) {
-    setText(element, "Error Loading Chart: " + message);
+  // TODO remove prefix for all messages
+  function chartError(element, message, noPrefix) {
+    if (!noPrefix) {
+      message = "Error Loading Chart: " + message;
+    }
+    setText(element, message);
     element.style.color = "#ff0000";
   }
 
@@ -1567,6 +1738,17 @@
       }, function (message) {
         chartError(chart.element, message);
       });
+    } else if (typeof dataSource === "function") {
+      try {
+        dataSource(function (data) {
+          chart.rawData = data;
+          errorCatcher(chart);
+        }, function (message) {
+          chartError(chart.element, message, true);
+        });
+      } catch (err) {
+        chartError(chart.element, err, true);
+      }
     } else {
       chart.rawData = dataSource;
       errorCatcher(chart);
@@ -1576,7 +1758,15 @@
   function addDownloadButton(chart) {
     var element = chart.element;
     var link = document.createElement("a");
-    link.download = chart.options.download === true ? "chart.png" : chart.options.download; // http://caniuse.com/download
+
+    var download = chart.options.download;
+    if (download === true) {
+      download = {};
+    } else if (typeof download === "string") {
+      download = {filename: download};
+    }
+    link.download = download.filename || "chart.png"; // https://caniuse.com/download
+
     link.style.position = "absolute";
     link.style.top = "20px";
     link.style.right = "20px";
@@ -1599,7 +1789,7 @@
       var related = e.relatedTarget;
       // check download option again to ensure it wasn't changed
       if ((!related || (related !== this && !childOf(this, related))) && chart.options.download) {
-        link.href = chart.toImage();
+        link.href = chart.toImage(download);
         element.appendChild(link);
       }
     });
@@ -1615,7 +1805,7 @@
     });
   }
 
-  // http://stackoverflow.com/questions/10149963/adding-event-listener-cross-browser
+  // https://stackoverflow.com/questions/10149963/adding-event-listener-cross-browser
   function addEvent(elem, event, fn) {
     if (elem.addEventListener) {
       elem.addEventListener(event, fn, false);
@@ -1649,7 +1839,7 @@
     if (library) {
       if (library.product === "Highcharts") {
         return defaultExport$1;
-      } else if (library.setOnLoadCallback || library.charts) {
+      } else if (library.charts) {
         return defaultExport$2;
       } else if (isFunction(library)) {
         return defaultExport;
@@ -1676,7 +1866,7 @@
       addAdapter(window.Highcharts);
     }
 
-    if (window.google && (window.google.setOnLoadCallback || window.google.charts)) {
+    if (window.google && window.google.charts) {
       addAdapter(window.google);
     }
   }
@@ -1761,17 +1951,27 @@
     return r;
   };
 
-  function detectDiscrete(series) {
+  function detectXType(series, noDatetime) {
+    if (detectXTypeWithFunction(series, isNumber)) {
+      return "number";
+    } else if (!noDatetime && detectXTypeWithFunction(series, isDate)) {
+      return "datetime";
+    } else {
+      return "string";
+    }
+  }
+
+  function detectXTypeWithFunction(series, func) {
     var i, j, data;
     for (i = 0; i < series.length; i++) {
       data = toArr(series[i].data);
       for (j = 0; j < data.length; j++) {
-        if (!isDate(data[j][0])) {
-          return true;
+        if (!func(data[j][0])) {
+          return false;
         }
       }
     }
-    return false;
+    return true;
   }
 
   // creates a shallow copy of each element of the array
@@ -1790,7 +1990,7 @@
     return newSeries;
   }
 
-  function processSeries(chart, keyType) {
+  function processSeries(chart, keyType, noDatetime) {
     var i;
 
     var opts = chart.options;
@@ -1798,27 +1998,18 @@
 
     // see if one series or multiple
     if (!isArray(series) || typeof series[0] !== "object" || isArray(series[0])) {
-      series = [{name: opts.label || "Value", data: series}];
+      series = [{name: opts.label, data: series}];
       chart.hideLegend = true;
     } else {
       chart.hideLegend = false;
     }
-    if ((opts.discrete === null || opts.discrete === undefined) && keyType !== "bubble" && keyType !== "number") {
-      chart.discrete = detectDiscrete(series);
-    } else {
-      chart.discrete = opts.discrete;
-    }
-    if (chart.discrete) {
-      keyType = "string";
-    }
-    if (chart.options.xtype) {
-      keyType = chart.options.xtype;
-    }
+
+    chart.xtype = keyType ? keyType : (opts.discrete ? "string" : detectXType(series, noDatetime));
 
     // right format
     series = copySeries(series);
     for (i = 0; i < series.length; i++) {
-      series[i].data = formatSeriesData(toArr(series[i].data), keyType);
+      series[i].data = formatSeriesData(toArr(series[i].data), chart.xtype);
     }
 
     return series;
@@ -1903,6 +2094,8 @@
       var sep = this.dataSource.indexOf("?") === -1 ? "?" : "&";
       var url = this.dataSource + sep + "_=" + (new Date()).getTime();
       fetchDataSource(this, url);
+    } else if (typeof this.dataSource === "function") {
+      fetchDataSource(this, this.dataSource);
     }
   };
 
@@ -1911,6 +2104,10 @@
 
     var refresh = this.options.refresh;
 
+    if (refresh && typeof this.dataSource !== "string" && typeof this.dataSource !== "function") {
+      throw new Error("Data source must be a URL or callback for refresh");
+    }
+
     if (!this.intervalId) {
       if (refresh) {
         this.intervalId = setInterval( function () {
@@ -1929,10 +2126,26 @@
     }
   };
 
-  Chart.prototype.toImage = function toImage () {
+  Chart.prototype.toImage = function toImage (download) {
     if (this.adapter === "chartjs") {
-      return this.chart.toBase64Image();
+      if (download && download.background && download.background !== "transparent") {
+        // https://stackoverflow.com/questions/30464750/chartjs-line-chart-set-background-color
+        var canvas = this.chart.chart.canvas;
+        var ctx = this.chart.chart.ctx;
+        var tmpCanvas = document.createElement("canvas");
+        var tmpCtx = tmpCanvas.getContext("2d");
+        tmpCanvas.width = ctx.canvas.width;
+        tmpCanvas.height = ctx.canvas.height;
+        tmpCtx.fillStyle = download.background;
+        tmpCtx.fillRect(0, 0, tmpCanvas.width, tmpCanvas.height);
+        tmpCtx.drawImage(canvas, 0, 0);
+        return tmpCanvas.toDataURL("image/png");
+      } else {
+        return this.chart.toBase64Image();
+      }
     } else {
+      // TODO throw error in next major version
+      // throw new Error("Feature only available for Chart.js");
       return null;
     }
   };
@@ -1969,7 +2182,7 @@
     return config;
   };
 
-  var LineChart = (function (Chart) {
+  var LineChart = /*@__PURE__*/(function (Chart) {
     function LineChart () {
       Chart.apply(this, arguments);
     }
@@ -1979,7 +2192,7 @@
     LineChart.prototype.constructor = LineChart;
 
     LineChart.prototype.__processData = function __processData () {
-      return processSeries(this, "datetime");
+      return processSeries(this);
     };
 
     LineChart.prototype.__chartName = function __chartName () {
@@ -1989,7 +2202,7 @@
     return LineChart;
   }(Chart));
 
-  var PieChart = (function (Chart) {
+  var PieChart = /*@__PURE__*/(function (Chart) {
     function PieChart () {
       Chart.apply(this, arguments);
     }
@@ -2009,7 +2222,7 @@
     return PieChart;
   }(Chart));
 
-  var ColumnChart = (function (Chart) {
+  var ColumnChart = /*@__PURE__*/(function (Chart) {
     function ColumnChart () {
       Chart.apply(this, arguments);
     }
@@ -2019,7 +2232,7 @@
     ColumnChart.prototype.constructor = ColumnChart;
 
     ColumnChart.prototype.__processData = function __processData () {
-      return processSeries(this, "string");
+      return processSeries(this, null, true);
     };
 
     ColumnChart.prototype.__chartName = function __chartName () {
@@ -2029,7 +2242,7 @@
     return ColumnChart;
   }(Chart));
 
-  var BarChart = (function (Chart) {
+  var BarChart = /*@__PURE__*/(function (Chart) {
     function BarChart () {
       Chart.apply(this, arguments);
     }
@@ -2039,7 +2252,7 @@
     BarChart.prototype.constructor = BarChart;
 
     BarChart.prototype.__processData = function __processData () {
-      return processSeries(this, "string");
+      return processSeries(this, null, true);
     };
 
     BarChart.prototype.__chartName = function __chartName () {
@@ -2049,7 +2262,7 @@
     return BarChart;
   }(Chart));
 
-  var AreaChart = (function (Chart) {
+  var AreaChart = /*@__PURE__*/(function (Chart) {
     function AreaChart () {
       Chart.apply(this, arguments);
     }
@@ -2059,7 +2272,7 @@
     AreaChart.prototype.constructor = AreaChart;
 
     AreaChart.prototype.__processData = function __processData () {
-      return processSeries(this, "datetime");
+      return processSeries(this);
     };
 
     AreaChart.prototype.__chartName = function __chartName () {
@@ -2069,7 +2282,7 @@
     return AreaChart;
   }(Chart));
 
-  var GeoChart = (function (Chart) {
+  var GeoChart = /*@__PURE__*/(function (Chart) {
     function GeoChart () {
       Chart.apply(this, arguments);
     }
@@ -2089,7 +2302,7 @@
     return GeoChart;
   }(Chart));
 
-  var ScatterChart = (function (Chart) {
+  var ScatterChart = /*@__PURE__*/(function (Chart) {
     function ScatterChart () {
       Chart.apply(this, arguments);
     }
@@ -2109,7 +2322,7 @@
     return ScatterChart;
   }(Chart));
 
-  var BubbleChart = (function (Chart) {
+  var BubbleChart = /*@__PURE__*/(function (Chart) {
     function BubbleChart () {
       Chart.apply(this, arguments);
     }
@@ -2129,7 +2342,7 @@
     return BubbleChart;
   }(Chart));
 
-  var Timeline = (function (Chart) {
+  var Timeline = /*@__PURE__*/(function (Chart) {
     function Timeline () {
       Chart.apply(this, arguments);
     }
@@ -2172,6 +2385,9 @@
         }
       }
     },
+    setDefaultOptions: function (opts) {
+      Chartkick.options = opts;
+    },
     eachChart: function (callback) {
       for (var chartId in Chartkick.charts) {
         if (Chartkick.charts.hasOwnProperty(chartId)) {
@@ -2182,9 +2398,21 @@
     config: config,
     options: {},
     adapters: adapters,
-    addAdapter: addAdapter
+    addAdapter: addAdapter,
+    use: function(adapter) {
+      addAdapter(adapter);
+      return Chartkick;
+    }
   };
 
+  // not ideal, but allows for simpler integration
+  if (typeof window !== "undefined" && !window.Chartkick) {
+    window.Chartkick = Chartkick;
+  }
+
+  // backwards compatibility for esm require
+  Chartkick.default = Chartkick;
+
   return Chartkick;
 
 })));