An upgraded embed-chart.js from https://gist.github.com/CGamesPlay/8628541. Now with sweet autocolors from @sterlingwes.

embed-chart.js

// Free to use & distribute under the MIT license
// Wes Johnson (@SterlingWes)
//
// inspired by http://martin.ankerl.com/2009/12/09/how-to-create-random-colors-programmatically/

(function (root, factory) {
    if (typeof exports === 'object') {
        module.exports = factory;
    } else if (typeof define === 'function' && define.amd) {
        define(factory);
    } else {
        root.RColor = factory();
    }
}(this, function () {

	var RColor = function() {
		this.hue			= Math.random(),
		this.goldenRatio 	= 0.618033988749895;
		this.hexwidth		= 2;
	};

	RColor.prototype.hsvToRgb = function (h,s,v) {
		var	h_i	= Math.floor(h*6),
			f 	= h*6 - h_i,
			p	= v * (1-s),
			q	= v * (1-f*s),
			t	= v * (1-(1-f)*s),
			r	= 255,
			g	= 255,
			b	= 255;
		switch(h_i) {
			case 0:	r = v, g = t, b = p;	break;
			case 1:	r = q, g = v, b = p;	break;
			case 2:	r = p, g = v, b = t;	break;
			case 3:	r = p, g = q, b = v;	break;
			case 4: r = t, g = p, b = v;	break;
			case 5: r = v, g = p, b = q;	break;
		}
		return [Math.floor(r*256),Math.floor(g*256),Math.floor(b*256)];
	};
	
	RColor.prototype.padHex = function(str) {
		if(str.length > this.hexwidth) return str;
		return new Array(this.hexwidth - str.length + 1).join('0') + str;
	};
	
	RColor.prototype.get = function(hex,saturation,value) {
		_hue = this.hue;
		this.hue += this.goldenRatio;
		this.hue %= 1;
		if(typeof saturation !== "number")	saturation = 0.5;
		if(typeof value !== "number")		value = 0.95;
		var rgb = this.hsvToRgb(this.hue,saturation,value);
		this.hue = _hue;
		if(hex)
			return "#" +  this.padHex(rgb[0].toString(16))
						+ this.padHex(rgb[1].toString(16))
						+ this.padHex(rgb[2].toString(16));
		else 
			return rgb;
	};

	RColor.prototype.getDarker = function(hex,saturation,value, darkerRatio) {
	  return this.get(hex, 1-darkerRatio*(1-saturation), 1-darkerRatio*(1-saturation));
	};

	return RColor;

}));



(function() {
  // 9
  // 9,999
  // 99 999
  // 99.9
  var MATCH_NUMBER = /[0-9, ]+(\.\d*)?/;
  var CHART_HEIGHT = 400;
  var unique_id = 0;
  
  function color(n) {
    var color = new RColor;
    rgb = color.get(false, 0.3, 0.99);
    console.log(rgb);
    _fillColor = 'rgba('+rgb[0].toString()+','+rgb[1].toString()+','+rgb[2].toString()+',0.3)';
    console.log(_fillColor);
    _strokeColor = color.getDarker(true, 0.3, 0.99, 0.8);
    _pointColor= _strokeColor;
      return (
      {
        fillColor: _fillColor,
        strokeColor: _strokeColor,
        pointColor: _pointColor,
        pointStrokeColor: "#fff",
      });
  }

  function get_data(container) {
    // Fail unless the next element in the DOM is the data table.
    var table = container.nextElementSibling;
    var series_shift = 2;
    var axis_selector = 'td:nth-child(1)';
    var label_selector = 'th:nth-child(N)';
    var series_selector = 'td:nth-child(N)';
    if (container.dataset.series == "rows") {
      series_shift = 1;
      axis_selector = 'th:not(:nth-child(1))';
      label_selector = 'tbody tr:nth-child(N) :first-child';
      series_selector = 'tbody tr:nth-child(N) :not(:first-child)';
    }

    // Assume the columns form series.
    var labels =
      Array.prototype.slice.call(table.querySelectorAll(axis_selector), 0)
      .map(function(e) { return e.textContent; });
    var datasets = [];
    for (var N = 0; N < 50; N++) {
      var series_title =
        table.querySelector(label_selector.replace('N', N + series_shift));
      if (!series_title) {
        break;
      }
      var series_data =
        Array.prototype.slice.call(table.querySelectorAll(series_selector.replace('N', N + series_shift)), 0)
        .map(function(e) {
          var match = MATCH_NUMBER.exec(e.textContent) || [ '' ];
          return parseFloat(match[0].replace(/[^0-9.]/g, ''));
        });
      var series = color();
      series.data = series_data;
      series.title = series_title.textContent;
      datasets.push(series);
    }
    return {
      labels: labels,
      datasets: datasets,
      table: table,
    };
  }

  function make_chart(container) {
    var id = "chart_" + ++unique_id;
    container.id = id;
    container.className = "figure";

    var focus_table = container.dataset.focus != "chart";
    var data = get_data(container);
    var options = {
      scaleFontFamily: 'Roboto',
      scaleFontSize: 14,
      showLegend: true,
    };
    for (var k in container.dataset) {
      options[k] = container.dataset[k];
    }
    var renderer = 'Bar';
    if (container.dataset.type == "line") {
      renderer = 'Line';
    }

    var tabs = document.createElement('div');
    tabs.className = "tabs";

    var view_table = document.createElement('input');
    var view_table_label = document.createElement('label');
    view_table.type = 'radio';
    view_table.name = 'view_' + id;
    view_table.className = view_table_label.className = "view_table";
    view_table.id = view_table_label.htmlFor = 'view_' + id + '_table';
    view_table.checked = focus_table;
    view_table_label.textContent = "Table";
    container.appendChild(view_table);
    tabs.appendChild(view_table_label);

    var view_chart = document.createElement('input');
    var view_chart_label = document.createElement('label');
    view_chart.type = 'radio';
    view_chart.name = 'view_' + id;
    view_chart.className = view_chart_label.className = "view_chart";
    view_chart.id = view_chart_label.htmlFor = 'view_' + id + '_chart';
    view_chart.checked = !focus_table;
    view_chart_label.textContent = "Chart";
    container.appendChild(view_chart);
    tabs.appendChild(view_chart_label);

    container.appendChild(tabs);
    container.appendChild(data.table);

    var canvas = document.createElement("canvas");
    canvas.width = container.clientWidth;
    canvas.height = Math.min(CHART_HEIGHT, document.body.clientHeight - 20);
    container.appendChild(canvas);

    var rendered = false;
    function render() {
      var new_width = container.clientWidth;
      var new_height = Math.min(CHART_HEIGHT, document.body.clientHeight - 20);

      if (rendered && canvas.width == new_width && canvas.height == new_height) {
        return;
      }
      rendered = true;

      canvas.width = new_width;
      canvas.height = new_height;
      var ctx = canvas.getContext('2d');
      var myChart = new Chart(ctx)[renderer](data, options);
    }

    if (!focus_table) {
      render();
    }
    view_chart.addEventListener('change', render, false);
    window.addEventListener('resize', function() {
      if (view_chart.checked) {
        render();
      }
    }, false);
  }

  window.addEventListener('load', function() {
    Array.prototype.slice.call(document.getElementsByTagName("div"), 0)
      .filter(function(e) { return e.dataset.figure === 'chart'; })
      .map(make_chart);
  }, false);
}());