MaximPetrichuk/d3.simple.chart

Easy and quick creation of simple charts on d3.js

d3.simple.chart

About

Very small and easy library for quick creation of simple line charts on d3.js.

How to use

Step 1. Load and prepare data

    d3.tsv("sample.tsv", function(error, data) {
      if (error) throw error;
      // parse date and numeric data before build chart
      d3sPreParceDann("Date","%d.%m.%Y",["Metal month","Mined %"],data);
      ...
    }

Step 2. Init param

      //initialize params of the chart
      var param = {
        parentSelector: "#chart1",
        width: 600,  // if 0 then get parent width
        height: 300, // if 0 then get parent height
        title: "Iron mine work",
        xColumn: "Date",
        xColumnDate: true,
        xAxisName: "Date work",
        yLeftAxisName: "Tonnes",
        yRightAxisName: "%",
        categories: [
          {name: "plan", width: "1px"},
          {name: "fact", width: "2px"}
        ],
        series: [
          {yColumn: "Metal month", title: "Metal in moth", color: "#ff6600", yAxis: "left"},
          {yColumn: "Mined %", title: "Mined proc.", color: "#0080ff", yAxis: "right"}
        ]
      };

Step 3. Create chart

      // build chart
      d3sChart(param,data,dataGroup);

Example of chart

Licence

BSD.