chartnado 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 3a2deb50132fdc707f83201e12dddf65b9d55de5
+  data.tar.gz: 3875cfbbacb92a1fa6d3ac486abfa5f587a845f7
+SHA512:
+  metadata.gz: 7b84dcfcff0a8df214eb2e8bd8c223eede3251e76764e34cce6bb9a5e738e9d029c517fac121e1615889b095c96e776b3aa8640d48c62de1d9b7ccfba31ee459
+  data.tar.gz: 3d2944100f2ec9022764e004f12301489e951542ac7b02cd8cd145db6b1fdfb781ffa2fff52df9e203bc79c343bdc3aa964501871aaa60a003307f041108ad05

data/.gemrelease

@@ -0,0 +1,2 @@
+bump:
+  tag: true

data/.gitignore

@@ -0,0 +1,20 @@
+*.gem
+*.rbc
+.bundle
+.config
+.yardoc
+.ruby*
+.idea*
+Gemfile.lock
+InstalledFiles
+_yardoc
+coverage
+doc/
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp
+Gemfile-custom

data/.travis.yml

@@ -0,0 +1,9 @@
+language: ruby
+rvm:
+  - 2.1.2
+  - 2.0.0
+# uncomment this line if your project needs to run something other than `rake`:
+# script: bundle exec rspec spec
+
+script:
+  CODECLIMATE_REPO_TOKEN= bundle exec rake

data/Gemfile

@@ -0,0 +1,6 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in chartkick.gemspec
+gemspec
+
+eval File.read('Gemfile-custom') if File.exist?('Gemfile-custom')

data/LICENSE.txt

@@ -0,0 +1,23 @@
+Copyright (c) 2014 Andrew Brown
+Original chartkick javasript copyright (c) Andrew Kane
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,137 @@
+# Chartnado [![Gem Version](https://badge.fury.io/rb/chartnado.svg)](http://badge.fury.io/rb/chartnado) [![Travis CI Status](https://travis-ci.org/dontfidget/chartnado.png?branch=master)](https://travis-ci.org/dontfidget/chartnado) [![Code Climate](https://codeclimate.com/github/dontfidget/chartnado.png)](https://codeclimate.com/github/dontfidget/chartnado) [![Code Climate](https://codeclimate.com/github/dontfidget/chartnado/coverage.png)](https://codeclimate.com/github/dontfidget/chartnado) [![Dependency Status](https://gemnasium.com/dontfidget/chartnado.svg)](https://gemnasium.com/dontfidget/chartnado)
+
+Chartnado layers on top of [`chartkick`](http://ankane.github.io/chartkick/) and [`chartkick-remote`](http://github.com/dontfidget/chartkick-remote) allowing basic vector-style operations directly on to make it easy to feed them into charts.  It also provides some useful defaults and the ability to show totals on pie and stacked area charts when using google charts.
+
+## Usage
+
+In your controller, add the following to tell the controller to respond to json requests for chart data:
+
+```ruby
+include Chartnado
+```
+
+Then in your views, now in your views, you can write an expression to show the average tasks completed per today relative to total tasks:
+
+```ruby
+<%= line_chart { Task.group_by_day(:completed_at).count / Task.count } %>
+```
+
+## Totals
+
+By default chartnado adds totals to pie and stacked area charts using some hacky settings for google charts.  To get the total to appear, you need to use the chartnado version of the chartkick javascript called `chartkick-chartnado.js` instead of `chartkick.js`.  If you are including the javascript in sprockets manifest file, this:
+
+```
+//= require chartkick
+```
+
+should be replaced by this:
+
+```
+//= require chartkick-chartnado
+```
+
+## Supported Vector Operations on Series
+
+Chartnado supports the following operations on series/multiple-series data:
+
+* Single/Multiple-Series * Scalar
+* Single/Multiple-Series / Scalar
+* Single/Multiple-Series / Single Series
+* Single Series / Single Series
+* Multiple-Series / Single Series
+* Multiple-Series / Multiple Series
+* Single/Multiple-Series + Scalar
+
+A "Series" is a hash of values (i.e. `{ 2 => 4, 3 => 9 }`).  A "Multiple-Series" can either be specified in two ways:
+
+1. With the series identifier as the first element in each array that forms the key, as in:
+    ```ruby
+        {['series a', 0] => 1}, ['series b', 0] => 2}
+    ```
+
+1. With the series identifier as the first element in an array of single series, as in:
+    ```ruby
+        [['series a', {0 => 1}], ['series b', {0 => 2}]]
+    ```
+
+All series in an operation must use the same format.
+
+## Remote Requests
+
+By default requests for data in blocks, will be fetched remotely, unless `remote: false` is passed as an option to *chartkick_remote*.  Using this methodology, it's easy to write a page that makes many, many json requests, which may swamp your server and possibly even time out if you have a global `timeout` value set for your ajax requests.  @maccman's jquery.ajax.queue.coffee script provides a basic queueing transport layer for ajax requests which I've modified to provide an option to set the maximum number of requests that can be made in parallel (see https://gist.github.com/dontfidget/1ad9ab33971b64fe6fef).  This is provided as part of Chartnado and you can include it in your javascript manifest like this:
+
+```
+//= require jquery.ajax.queue-concurrent
+```
+  
+Chartnado extends chartkick to accept an *ajaxOptions* hash, which can be passed via chartkick_remote, which means you can then specify the maximum number of allowable requests globally for your page as follows:
+
+
+```
+chartkick_remote ajaxOptions: {queue: true, queueMaxConcurrency: 2} 
+```
+
+## Chartnado::SeriesHelper
+
+Chartnado also offers direct access to the helpers that implement the above operators.
+
+* series_product
+* series_ratio
+* series_sum
+
+To include these, just add:
+
+`include Chartnado::Series`
+
+### group_by
+
+While you can use ActiveRequest::Query.group to group results, you may find it useful to (a) make the grouping the first key, and (b) aggregate/rename groups.  `group_by` provides this ability as follows:
+
+```ruby
+  group_by('owners.id', Task.group_by_day(:completed_at)) { count }
+  
+```
+
+You can call it as: 
+
+```ruby
+group_by(<expression>, scope, optional_label_block, &eval_block)
+```
+
+where *block* calls the aggregating function you want applied to scope and *optional_label_block* is passed each key and data, so you can change the key (and even the data if you like).  The result for hash entries with identical keys is summed.  The label block is expected to return a 2-element array, where the first element is the key and the second element is the data.
+
+To include these, just add:
+
+`include Chartnado::GroupBy`
+
+### Defining series 
+
+It may be useful to define series/multiple-series inside your code so that it can be shared in multiple views.  Chartnado provides the `define_series` and `define_multiple_series` class methods to aid in adding shared series in your helpers.
+
+```ruby
+    # for a single series
+    define_series(:my_series) { { 0 => 1 } / 2 }`
+    
+    # for multiple series
+    define_multiple_series(
+      my_first_series: -> { { 0 => 1 } / 2 }
+      my_second_series: -> { { 0 => 1 } / 2 }
+    )
+```
+
+To include these methods in a view helper, just add the following to the helper:
+
+`include Chartnado::Helpers::SeriesHelpers
+
+### Wrapping the chart renderer
+
+You can wrap the chart rendering method in your controller if you want finer control over the rendering process, such as wrapping the chartkick output in a partial.  To do this, include something like the following in your controller:
+
+```ruby
+    chartnado_wrapper :custom_renderer
+    
+    def custom_renderer(*args, **options, &block)
+      title = options[:title]
+      render 'my-chart-partial', title: title, &block
+    end
+```

data/Rakefile

@@ -0,0 +1,7 @@
+require "bundler/gem_tasks"
+require 'rspec/core/rake_task'
+
+RSpec::Core::RakeTask.new(:spec)
+
+task :default => :spec
+

data/chartnado.gemspec

@@ -0,0 +1,35 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'chartnado/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "chartnado"
+  spec.version       = Chartnado::VERSION
+  spec.authors       = ["Andrew S. Brown"]
+  spec.email         = ["andrew@dontfidget.com"]
+  spec.description   = %q{Chartkick charts with extras}
+  spec.summary       = %q{Chartkick charts with extras}
+  spec.homepage      = "https://github.com/dontfidget/chartnado"
+  spec.license       = "MIT"
+
+  spec.files         = `git ls-files`.split($/)
+  spec.executables   = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
+  spec.test_files    = spec.files.grep(%r{^(test|spec|features)/})
+  spec.require_paths = ["lib"]
+  spec.required_ruby_version = '>= 2.0'
+
+  spec.add_dependency "activesupport", '>= 3'
+  spec.add_dependency "chartkick", '>= 1.0'
+  spec.add_dependency "chartkick-remote", '>= 1.0'
+  spec.add_dependency "railties", ">= 3.1"
+  spec.add_development_dependency "bundler", '~> 1.3'
+  spec.add_development_dependency "rake", '~> 10.3'
+  spec.add_development_dependency "rspec", '~> 3.0'
+  spec.add_development_dependency "rspec-core", '~> 3.0'
+  spec.add_development_dependency "rspec-mocks", '~> 3.0'
+  spec.add_development_dependency "rspec-rails", '~> 3.0'
+  spec.add_development_dependency "travis-lint", '~> 1.8'
+  spec.add_development_dependency "codeclimate-test-reporter", '~> 0.3'
+  # spec.add_development_dependency "rspec-html-matchers", '~> 0.6.1', '>= 0.6.1'
+end

data/lib/assets/javascripts/chartkick-chartnado.js

@@ -0,0 +1,864 @@
+/*
+ * Derived from:
+ *
+ * Chartkick.js
+ * Create beautiful Javascript charts with minimal code
+ * https://github.com/ankane/chartkick.js
+ * v1.2.2
+ * MIT License
+ */
+
+/*jslint browser: true, indent: 2, plusplus: true, vars: true */
+
+(function (window) {
+  'use strict';
+
+  var config = window.Chartkick || {};
+  var Chartkick, ISO8601_PATTERN, DECIMAL_SEPARATOR, adapters = [];
+
+  // helpers
+
+  function isArray(variable) {
+    return Object.prototype.toString.call(variable) === "[object Array]";
+  }
+
+  function isFunction(variable) {
+    return variable instanceof Function;
+  }
+
+  function isPlainObject(variable) {
+    return !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) {
+      if (isPlainObject(source[key]) || isArray(source[key])) {
+        if (isPlainObject(source[key]) && !isPlainObject(target[key])) {
+          target[key] = {};
+        }
+        if (isArray(source[key]) && !isArray(target[key])) {
+          target[key] = [];
+        }
+        extend(target[key], source[key]);
+      } else if (source[key] !== undefined) {
+        target[key] = source[key];
+      }
+    }
+  }
+
+  function merge(obj1, obj2) {
+    var target = {};
+    extend(target, obj1);
+    extend(target, obj2);
+    return target;
+  }
+
+  // https://github.com/Do/iso8601.js
+  ISO8601_PATTERN = /(\d\d\d\d)(\-)?(\d\d)(\-)?(\d\d)(T)?(\d\d)(:)?(\d\d)?(:)?(\d\d)?([\.,]\d+)?($|Z|([\+\-])(\d\d)(:)?(\d\d)?)/i;
+  DECIMAL_SEPARATOR = String(1.5).charAt(1);
+
+  function parseISO8601(input) {
+    var day, hour, matches, milliseconds, minutes, month, offset, result, seconds, type, year;
+    type = Object.prototype.toString.call(input);
+    if (type === '[object Date]') {
+      return input;
+    }
+    if (type !== '[object String]') {
+      return;
+    }
+    if (matches = input.match(ISO8601_PATTERN)) {
+      year = parseInt(matches[1], 10);
+      month = parseInt(matches[3], 10) - 1;
+      day = parseInt(matches[5], 10);
+      hour = parseInt(matches[7], 10);
+      minutes = matches[9] ? parseInt(matches[9], 10) : 0;
+      seconds = matches[11] ? parseInt(matches[11], 10) : 0;
+      milliseconds = matches[12] ? parseFloat(DECIMAL_SEPARATOR + matches[12].slice(1)) * 1000 : 0;
+      result = Date.UTC(year, month, day, hour, minutes, seconds, milliseconds);
+      if (matches[13] && matches[14]) {
+        offset = matches[15] * 60;
+        if (matches[17]) {
+          offset += parseInt(matches[17], 10);
+        }
+        offset *= matches[14] === '-' ? -1 : 1;
+        result -= offset * 60 * 1000;
+      }
+      return new Date(result);
+    }
+  }
+  // end iso8601.js
+
+  function negativeValues(series) {
+    var i, j, data;
+    for (i = 0; i < series.length; i++) {
+      data = series[i].data;
+      for (j = 0; j < data.length; j++) {
+        if (data[j][1] < 0) {
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+
+  function jsOptionsFunc(defaultOptions, hideLegend, setMin, setMax, setStacked) {
+    return function (series, opts, chartOptions) {
+      var options = merge({}, defaultOptions);
+      options = merge(options, chartOptions || {});
+
+      // hide legend
+      // this is *not* an external option!
+      if (opts.hideLegend) {
+        hideLegend(options);
+      }
+
+      // min
+      if ("min" in opts) {
+        setMin(options, opts.min);
+      } else if (!negativeValues(series)) {
+        setMin(options, 0);
+      }
+
+      // max
+      if ("max" in opts) {
+        setMax(options, opts.max);
+      }
+
+      if (opts.stacked) {
+        setStacked(options);
+      }
+
+      if (opts.colors) {
+        options.colors = opts.colors;
+      }
+
+      // merge library last
+      options = merge(options, opts.library || {});
+
+      return options;
+    };
+  }
+
+  function setText(element, text) {
+    if (document.body.innerText) {
+      element.innerText = text;
+    } else {
+      element.textContent = text;
+    }
+  }
+
+  function chartError(element, message) {
+    setText(element, "Error Loading Chart: " + message);
+    element.style.color = "#ff0000";
+  }
+
+  function getJSON(element, url, options, success) {
+    var $ = window.jQuery || window.Zepto || window.$;
+    $.ajax($.extend({}, options, {
+      dataType: "json",
+      url: url,
+      success: success,
+      error: function (jqXHR, textStatus, errorThrown) {
+        var message = (typeof errorThrown === "string") ? errorThrown : errorThrown.message;
+        chartError(element, message);
+      }
+    }));
+  }
+
+  function errorCatcher(chart, callback) {
+    try {
+      callback(chart);
+    } catch (err) {
+      chartError(chart.element, err.message);
+      throw err;
+    }
+  }
+
+  function fetchDataSource(chart, callback) {
+    if (typeof chart.dataSource === "string") {
+      getJSON(chart.element, chart.dataSource, chart.options.ajaxOptions, function (data, textStatus, jqXHR) {
+        chart.data = data;
+        errorCatcher(chart, callback);
+      });
+    } else {
+      chart.data = chart.dataSource;
+      errorCatcher(chart, callback);
+    }
+  }
+
+  // type conversions
+
+  function toStr(n) {
+    return "" + n;
+  }
+
+  function toFloat(n) {
+    return parseFloat(n);
+  }
+
+  function toDate(n) {
+    if (typeof n !== "object") {
+      if (typeof n === "number") {
+        n = new Date(n * 1000); // ms
+      } else { // str
+        // try our best to get the str into iso8601
+        // TODO be smarter about this
+        var str = n.replace(/ /, "T").replace(" ", "").replace("UTC", "Z");
+        n = parseISO8601(str) || new Date(n);
+      }
+    }
+    return n;
+  }
+
+  function toArr(n) {
+    if (!isArray(n)) {
+      var arr = [], i;
+      for (i in n) {
+        if (n.hasOwnProperty(i)) {
+          arr.push([i, n[i]]);
+        }
+      }
+      n = arr;
+    }
+    return n;
+  }
+
+  function sortByTime(a, b) {
+    return a[0].getTime() - b[0].getTime();
+  }
+
+  if ("Highcharts" in window) {
+    var HighchartsAdapter = new function () {
+      var Highcharts = window.Highcharts;
+
+      var defaultOptions = {
+        chart: {},
+        xAxis: {
+          labels: {
+            style: {
+              fontSize: "12px"
+            }
+          }
+        },
+        yAxis: {
+          title: {
+            text: null
+          },
+          labels: {
+            style: {
+              fontSize: "12px"
+            }
+          }
+        },
+        title: {
+          text: null
+        },
+        credits: {
+          enabled: false
+        },
+        legend: {
+          borderWidth: 0
+        },
+        tooltip: {
+          style: {
+            fontSize: "12px"
+          }
+        },
+        plotOptions: {
+          areaspline: {},
+          series: {
+            marker: {}
+          }
+        }
+      };
+
+      var hideLegend = function (options) {
+        options.legend.enabled = false;
+      };
+
+      var setMin = function (options, min) {
+        options.yAxis.min = min;
+      };
+
+      var setMax = function (options, max) {
+        options.yAxis.max = max;
+      };
+
+      var setStacked = function (options) {
+        options.plotOptions.series.stacking = "normal";
+      };
+
+      var jsOptions = jsOptionsFunc(defaultOptions, hideLegend, setMin, setMax, setStacked);
+
+      this.renderLineChart = function (chart, chartType) {
+        chartType = chartType || "spline";
+        var chartOptions = {};
+        if (chartType === "areaspline") {
+          chartOptions = {
+            plotOptions: {
+              areaspline: {
+                stacking: "normal"
+              },
+              series: {
+                marker: {
+                  enabled: false
+                }
+              }
+            }
+          };
+        }
+        var options = jsOptions(chart.data, chart.options, chartOptions), data, i, j;
+        options.xAxis.type = chart.options.discrete ? "category" : "datetime";
+        options.chart.type = chartType;
+        options.chart.renderTo = chart.element.id;
+
+        var series = chart.data;
+        for (i = 0; i < series.length; i++) {
+          data = series[i].data;
+          if (!chart.options.discrete) {
+            for (j = 0; j < data.length; j++) {
+              data[j][0] = data[j][0].getTime();
+            }
+          }
+          series[i].marker = {symbol: "circle"};
+        }
+        options.series = series;
+        new Highcharts.Chart(options);
+      };
+
+      this.renderPieChart = function (chart) {
+        var chartOptions = {};
+        if (chart.options.colors) {
+          chartOptions.colors = chart.options.colors;
+        }
+        var options = merge(merge(defaultOptions, chartOptions), chart.options.library || {});
+        options.chart.renderTo = chart.element.id;
+        options.series = [{
+          type: "pie",
+          name: "Value",
+          data: chart.data
+        }];
+        new Highcharts.Chart(options);
+      };
+
+      this.renderColumnChart = function (chart, chartType) {
+        var chartType = chartType || "column";
+        var series = chart.data;
+        var options = jsOptions(series, chart.options), i, j, s, d, rows = [];
+        options.chart.type = chartType;
+        options.chart.renderTo = chart.element.id;
+
+        for (i = 0; i < series.length; i++) {
+          s = series[i];
+
+          for (j = 0; j < s.data.length; j++) {
+            d = s.data[j];
+            if (!rows[d[0]]) {
+              rows[d[0]] = new Array(series.length);
+            }
+            rows[d[0]][i] = d[1];
+          }
+        }
+
+        var categories = [];
+        for (i in rows) {
+          if (rows.hasOwnProperty(i)) {
+            categories.push(i);
+          }
+        }
+        options.xAxis.categories = categories;
+
+        var newSeries = [];
+        for (i = 0; i < series.length; i++) {
+          d = [];
+          for (j = 0; j < categories.length; j++) {
+            d.push(rows[categories[j]][i] || 0);
+          }
+
+          newSeries.push({
+            name: series[i].name,
+            data: d
+          });
+        }
+        options.series = newSeries;
+
+        new Highcharts.Chart(options);
+      };
+
+      var self = this;
+
+      this.renderBarChart = function (chart) {
+        self.renderColumnChart(chart, "bar");
+      };
+
+      this.renderAreaChart = function (chart) {
+        self.renderLineChart(chart, "areaspline");
+      };
+    };
+    adapters.push(HighchartsAdapter);
+  }
+  if (window.google && window.google.setOnLoadCallback) {
+    var GoogleChartsAdapter = new function () {
+      var google = window.google;
+
+      var loaded = {};
+      var callbacks = [];
+
+      var runCallbacks = function () {
+        var cb, call;
+        for (var i = 0; i < callbacks.length; i++) {
+          cb = callbacks[i];
+          call = google.visualization && ((cb.pack == "corechart" && google.visualization.LineChart) || (cb.pack == "timeline" && google.visualization.Timeline))
+          if (call) {
+            cb.callback();
+            callbacks.splice(i, 1);
+            i--;
+          }
+        }
+      };
+
+      var waitForLoaded = function (pack, callback) {
+        if (!callback) {
+          callback = pack;
+          pack = "corechart";
+        }
+
+        callbacks.push({pack: pack, callback: callback});
+
+        if (loaded[pack]) {
+          runCallbacks();
+        } else {
+          loaded[pack] = true;
+
+          // https://groups.google.com/forum/#!topic/google-visualization-api/fMKJcyA2yyI
+          var loadOptions = {
+            packages: [pack],
+            callback: runCallbacks
+          };
+          if (config.language) {
+            loadOptions.language = config.language;
+          }
+          google.load("visualization", "1", loadOptions);
+        }
+      };
+
+      // Set chart options
+      var defaultOptions = {
+        chartArea: {},
+        fontName: "'Lucida Grande', 'Lucida Sans Unicode', Verdana, Arial, Helvetica, sans-serif",
+        pointSize: 6,
+        legend: {
+          textStyle: {
+            fontSize: 12,
+            color: "#444"
+          },
+          alignment: "center",
+          position: "right"
+        },
+        curveType: "function",
+        hAxis: {
+          textStyle: {
+            color: "#666",
+            fontSize: 12
+          },
+          gridlines: {
+            color: "transparent"
+          },
+          baselineColor: "#ccc",
+          viewWindow: {}
+        },
+        vAxis: {
+          textStyle: {
+            color: "#666",
+            fontSize: 12
+          },
+          baselineColor: "#ccc",
+          viewWindow: {}
+        },
+        tooltip: {
+          textStyle: {
+            color: "#666",
+            fontSize: 12
+          }
+        }
+      };
+
+      var hideLegend = function (options) {
+        options.legend.position = "none";
+      };
+
+      var setMin = function (options, min) {
+        options.vAxis.viewWindow.min = min;
+      };
+
+      var setMax = function (options, max) {
+        options.vAxis.viewWindow.max = max;
+      };
+
+      var setBarMin = function (options, min) {
+        options.hAxis.viewWindow.min = min;
+      };
+
+      var setBarMax = function (options, max) {
+        options.hAxis.viewWindow.max = max;
+      };
+
+      var setStacked = function (options) {
+        options.isStacked = true;
+      };
+
+      var jsOptions = jsOptionsFunc(defaultOptions, hideLegend, setMin, setMax, setStacked);
+
+      // cant use object as key
+      var createDataTable = function (series, columnType) {
+        var data = new google.visualization.DataTable();
+        data.addColumn(columnType, "");
+
+        var i, j, s, d, rows = [], pos, rowPos = [], columns;
+        for (i = 0, columns = 0; i < series.length; i++, columns++) {
+          rowPos[i] = columns;
+          if (series[i].tooltip) {
+            columns++;
+          }
+        }
+
+        function setData(key, value, pos, valueIsString) {
+          var newKey = (columnType === "datetime") ? key.getTime() : key;
+          if (!rows[newKey]) {
+            rows[newKey] = new Array(columns);
+          }
+          if (!valueIsString) {
+            value = toFloat(value);
+          }
+          rows[newKey][pos] = value;
+        }
+
+        for (i = 0; i < series.length; i++) {
+          pos = rowPos[i];
+          s = series[i];
+          data.addColumn("number", s.name);
+          for (j = 0; j < s.data.length; j++) {
+            d = s.data[j];
+            setData(d[0], toFloat(d[1]), pos);
+          }
+          if (s.tooltip) {
+            data.addColumn({type: 'string', role: 'tooltip'});
+            for (j = 0; j < s.tooltip.length; j++) {
+              d = s.tooltip[j];
+              setData(d[0], d[1], pos + 1, true);
+            }
+          }
+        }
+
+        var rows2 = [];
+        for (i in rows) {
+          if (rows.hasOwnProperty(i)) {
+            rows2.push([(columnType === "datetime") ? new Date(toFloat(i)) : i].concat(rows[i]));
+          }
+        }
+        if (columnType === "datetime") {
+          rows2.sort(sortByTime);
+        }
+        data.addRows(rows2);
+
+        return data;
+      };
+
+      var resize = function (callback) {
+        if (window.attachEvent) {
+          window.attachEvent("onresize", callback);
+        } else if (window.addEventListener) {
+          window.addEventListener("resize", callback, true);
+        }
+        callback();
+      };
+
+      this.renderLineChart = function (chart) {
+        waitForLoaded(function () {
+          var options = jsOptions(chart.data, chart.options);
+          var data = createDataTable(chart.data, chart.options.discrete ? "string" : "datetime");
+          chart.chart = new google.visualization.LineChart(chart.element);
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+
+      this.renderPieChart = function (chart) {
+        waitForLoaded(function () {
+          var chartOptions = {
+            chartArea: {
+              top: "10%",
+              height: "80%"
+            }
+          };
+          if (chart.options.colors) {
+            chartOptions.colors = chart.options.colors;
+          }
+          var options = merge(merge(defaultOptions, chartOptions), chart.options.library || {});
+
+          var data = new google.visualization.DataTable();
+          data.addColumn("string", "");
+          data.addColumn("number", "Value");
+          data.addRows(chart.data);
+
+          chart.chart = new google.visualization.PieChart(chart.element);
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+
+      this.renderColumnChart = function (chart) {
+        waitForLoaded(function () {
+          var options = jsOptions(chart.data, chart.options);
+          var data = createDataTable(chart.data, "string");
+          chart.chart = new google.visualization.ColumnChart(chart.element);
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+
+      this.renderBarChart = function (chart) {
+        waitForLoaded(function () {
+          var chartOptions = {
+            hAxis: {
+              gridlines: {
+                color: "#ccc"
+              }
+            }
+          };
+          var options = jsOptionsFunc(defaultOptions, hideLegend, setBarMin, setBarMax, setStacked)(chart.data, chart.options, chartOptions);
+          var data = createDataTable(chart.data, "string");
+          chart.chart = new google.visualization.BarChart(chart.element);
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+
+      this.renderAreaChart = function (chart) {
+        waitForLoaded(function () {
+          var chartOptions = {
+            isStacked: true,
+            pointSize: 0,
+            areaOpacity: 0.5
+          };
+          var options = jsOptions(chart.data, chart.options, chartOptions);
+          var data = createDataTable(chart.data, chart.options.discrete ? "string" : "datetime");
+          chart.chart = new google.visualization.AreaChart(chart.element);
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+
+      this.renderGeoChart = function (chart) {
+        waitForLoaded(function () {
+          var chartOptions = {
+            legend: "none",
+            colorAxis: {
+              colors: chart.options.colors || ["#f6c7b6", "#ce502d"]
+            }
+          };
+          var options = merge(merge(defaultOptions, chartOptions), chart.options.library || {});
+
+          var data = new google.visualization.DataTable();
+          data.addColumn("string", "");
+          data.addColumn("number", "Value");
+          data.addRows(chart.data);
+
+          chart.chart = new google.visualization.GeoChart(chart.element);
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+
+      this.renderTimeline = function (chart) {
+        waitForLoaded("timeline", function () {
+          var chartOptions = {
+            legend: "none"
+          };
+
+          if (chart.options.colors) {
+            chartOptions.colorAxis.colors = chart.options.colors;
+          }
+          var options = merge(merge(defaultOptions, chartOptions), chart.options.library || {});
+
+          var data = new google.visualization.DataTable();
+          data.addColumn({type: "string", id: "Name"});
+          data.addColumn({type: "date", id: "Start"});
+          data.addColumn({type: "date", id: "End"});
+          data.addRows(chart.data);
+
+          chart.chart = new google.visualization.Timeline(chart.element);
+
+          resize(function () {
+            chart.chart.draw(data, options);
+          });
+        });
+      };
+    };
+
+    adapters.push(GoogleChartsAdapter);
+  }
+
+  // TODO add adapter option
+  // TODO remove chartType if cross-browser way
+  // to get the name of the chart class
+  function renderChart(chartType, chart) {
+    var i, adapter, fnName;
+    fnName = "render" + chartType;
+
+    for (i = 0; i < adapters.length; i++) {
+      adapter = adapters[i];
+      if (isFunction(adapter[fnName])) {
+        return adapter[fnName](chart);
+      }
+    }
+    throw new Error("No adapter found");
+  }
+
+  // process data
+
+  function processSeries(series, opts, time) {
+    var i, data, key;
+
+    // see if one series or multiple
+    if (!isArray(series) || typeof series[0] !== "object" || isArray(series[0])) {
+      series = [{name: "Value", data: series}];
+      opts.hideLegend = true;
+    } else {
+      opts.hideLegend = false;
+    }
+    if (opts.discrete) {
+      time = false;
+    }
+
+    function formatData(inputData, valueIsString) {
+      var j, r = [], data = toArr(inputData), value;
+      for (j = 0; j < data.length; j++) {
+        key = data[j][0];
+        key = time ? toDate(key) : toStr(key);
+        value = data[j][1];
+        if (valueIsString) {
+          value = toStr(value)
+        } else {
+          value = toFloat(value);
+        }
+        r.push([key, value]);
+      }
+      if (time) {
+        r.sort(sortByTime);
+      }
+      return r;
+    }
+
+    // right format
+    for (i = 0; i < series.length; i++) {
+      series[i].data = formatData(series[i].data);
+      if (series[i].tooltip) {
+        series[i].tooltip = formatData(series[i].tooltip, true);
+      }
+    }
+
+    return series;
+  }
+
+  function processSimple(data) {
+    var perfectData = toArr(data), i;
+    for (i = 0; i < perfectData.length; i++) {
+      perfectData[i] = [toStr(perfectData[i][0]), toFloat(perfectData[i][1])];
+    }
+    return perfectData;
+  }
+
+  function processTime(data)
+  {
+    var i;
+    for (i = 0; i < data.length; i++) {
+      data[i][1] = toDate(data[i][1]);
+      data[i][2] = toDate(data[i][2]);
+    }
+    return data;
+  }
+
+  function processLineData(chart) {
+    chart.data = processSeries(chart.data, chart.options, true);
+    renderChart("LineChart", chart);
+  }
+
+  function processColumnData(chart) {
+    chart.data = processSeries(chart.data, chart.options, false);
+    renderChart("ColumnChart", chart);
+  }
+
+  function processPieData(chart) {
+    chart.data = processSimple(chart.data);
+    renderChart("PieChart", chart);
+  }
+
+  function processBarData(chart) {
+    chart.data = processSeries(chart.data, chart.options, false);
+    renderChart("BarChart", chart);
+  }
+
+  function processAreaData(chart) {
+    chart.data = processSeries(chart.data, chart.options, true);
+    renderChart("AreaChart", chart);
+  }
+
+  function processGeoData(chart) {
+    chart.data = processSimple(chart.data);
+    renderChart("GeoChart", chart);
+  }
+
+  function processTimelineData(chart) {
+    chart.data = processTime(chart.data);
+    renderChart("Timeline", chart);
+  }
+
+  function setElement(chart, element, dataSource, opts, callback) {
+    if (typeof element === "string") {
+      element = document.getElementById(element);
+    }
+    chart.element = element;
+    chart.options = opts || {};
+    chart.dataSource = dataSource;
+    Chartkick.charts[element.id] = chart;
+    fetchDataSource(chart, callback);
+  }
+
+  // define classes
+
+  Chartkick = {
+    LineChart: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processLineData);
+    },
+    PieChart: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processPieData);
+    },
+    ColumnChart: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processColumnData);
+    },
+    BarChart: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processBarData);
+    },
+    AreaChart: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processAreaData);
+    },
+    GeoChart: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processGeoData);
+    },
+    Timeline: function (element, dataSource, opts) {
+      setElement(this, element, dataSource, opts, processTimelineData);
+    },
+    charts: {}
+  };
+
+  window.Chartkick = Chartkick;
+}(window));