d3.js - nvd3 - how to draw a line over a scatterPlusLineChart, with specific cordinates -
d3.js - nvd3 - how to draw a line over a scatterPlusLineChart, with specific cordinates -
i have plotted scatter bubble chart using model 'scatterpluslinechart', , working fine. need draw line specific points. please help if knows.
var chart; nv.addgraph(function() {   chart = nv.models.scatterpluslinechart()                 .showdistx(true)                 .showdisty(true)                 .transitionduration(300)                 .color(d3.scale.category10().range());    chart.xaxis.tickformat(d3.format('.02f'))   chart.yaxis.tickformat(d3.format('.02f'))   var graphdata = [{key : 'group1',                            values : [{x:1, y:5, shape : 'circle'}, {x:4, y:2, shape : 'circle'}]                    },                    {key : 'group2',                            values : [{x:4, y:3, shape : 'circle'}, {x:1, y:6, shape : 'circle'}]                    }                    ]   d3.select('#test1 svg')       .datum(nv.log(graphdata))       .call(chart);    nv.utils.windowresize(chart.update);    chart.dispatch.on('statechange', function(e) { nv.log('new state:', json.stringify(e)); });     homecoming chart; });    above existing code , next requirement
draw 2 lines
1) through (1,5) (4,3)
2) through (4,2) (1,6)
use slope , intercept groups arguments specify lines parameters.
for illustration :
var graphdata = [{         key: 'group1',         values: [{             x: 1,             y: 5         }, {             x: 4,             y: 2         }],         intercept: 6,         slope: -1     }, {         key : 'group2',         values : [{             x: 4,             y: 3         }, {             x: 1,             y: 6         }],         intercept: 7,         slope: -1     }]    i allow utilize appropriate maths calculate slope , intercept of trend lines.
 d3.js nvd3.js 
 
Comments
Post a Comment