ft-interactive / nightingale-charts

FT style charts, axes, scales etc
http://ft-interactive.github.io/nightingale-charts
12 stars 5 forks source link

update how to docs to show how to create a simple line-chart #56

Closed peter-mouland closed 8 years ago

peter-mouland commented 9 years ago
            var oCharts = require('o-charts');

            //Dimensions and padding
            var w = 600;
            var h = 260;
            var padding = [ 20, 10, 30, 20 ];  //Top, right, bottom, left

            var ySeries = [];
            function formatData(data){
                debugger;
                var newData = [];
                data.forEach(function(d,i){
                    var row = 0;
                    for (var year in d){
                        if (isNaN(parseInt(year))) continue;
                        newData[row] = newData[row] || { };
                        newData[row].year = new Date(year)
                        newData[row][d.countryName] = parseFloat(d[year])
                        if (ySeries.indexOf(d.countryName)<0) {
                            ySeries.push(d.countryName);
                        }
                        row++;
                    }
                });
                return newData;
            }

            d3.csv("barometerTestChart.csv", function(data) {
                var formattedData = formatData(data)
                var defaultData = {
                    width: w,
                    // height: h,
                    comment: "Line chart",
                    footnote: "this is just for testing!",
                    source: "tbc",
                    title: "Some Simple Lines: ",
                    subtitle: "Drawn for you",
                    numberAxisOrient: 'left',
                    hideSource: false,
                    lineThickness: 'small',
                    x: {
                        series: {key: 'year', label: 'Year'}
                    },
                    y: { series: ySeries },
                    data: formattedData
                };

                d3.select('body').append('div')
                       .data([defaultData])
                    .call(oCharts.chart.line);

            });
Cleve Jones [12:23 PM]
countryName,2009,2010,2011,2012,2013,2014,2015
Argentina,18.757,18.445,18.177,17.958,17.788,17.66,17.564
Australia,13,12.7,12.8,12.6,12.3,12.8,12.9
Austria,9.8,9.4,9.7,9.5,9.7,9.5,9.4
Bangladesh,27.028,26.307,25.581,24.855,24.135,23.442,22.8
Barbados,13.463,13.349,13.262,13.194,13.137,13.089,13.043
Belgium,11.4,11.2,10.9,11,11.3,11.4,11.6
Bermuda,13.5,13.3,13.2,13.2,13.2,13.1,12.5
Bosnia and Herzegovina,10.199,9.64,9.14,8.748,8.48,8.338,8.307
Botswana,27.402,26.88,26.417,26.022,25.692,25.417,25.182
peter-mouland commented 8 years ago

closing this due to lack of interest (read: tidying up my outstanding issues feed!) feel free to raise a new issue if you guys still care about this.