diff --git a/nvd3/nvd3-test-pie.ts b/nvd3/nvd3-test-pie.ts new file mode 100644 index 0000000000..1a0270a206 --- /dev/null +++ b/nvd3/nvd3-test-pie.ts @@ -0,0 +1,71 @@ +/// +/// +module nvd3_test_pie { + + var testdata = [ + { key: "One", y: 5 }, + { key: "Two", y: 2 }, + { key: "Three", y: 9 }, + { key: "Four", y: 7 }, + { key: "Five", y: 4 }, + { key: "Six", y: 3 }, + { key: "Seven", y: 0.5 } + ]; + + var width = 300; + var height = 300; + + nv.addGraph(function () { + var chart = nv.models.pie() + .x(function (d) { return d.key; }) + .y(function (d) { return d.y; }) + .width(width) + .height(height) + .labelType(function (d, i, values) { + return values.key + ':' + values.value; + }) + ; + + d3.select("#test1") + .datum([testdata]) + .transition().duration(1200) + .attr('width', width) + .attr('height', height) + .call(chart); + + // LISTEN TO CLICK EVENTS ON THE PIE CONTAINER + // chart.dispatch.on('chartClick', function() { + // code... + // }); + + // LISTEN TO CLICK EVENTS ON THE SLICES OF THE PIE + // chart.dispatch.on('elementClick', function() { + // code... + // }); + + // OTHER EVENTS DISPATCHED BY THE PIE INCLUDE: elementDblClick, elementMouseover, elementMouseout, elementMousemove, renderEnd + // @see nv.models.pie + return chart; + }); + + nv.addGraph(function () { + var chart = nv.models.pie() + .x(function (d) { return d.key; }) + .y(function (d) { return d.y; }) + .width(width) + .height(height) + .labelType('percent') + .valueFormat(d3.format('%')) + .donut(true); + + d3.select("#test2") + .datum([testdata]) + .transition().duration(1200) + .attr('width', width) + .attr('height', height) + .call(chart); + + return chart; + }); + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-pieChart.ts b/nvd3/nvd3-test-pieChart.ts new file mode 100644 index 0000000000..688da56ffd --- /dev/null +++ b/nvd3/nvd3-test-pieChart.ts @@ -0,0 +1,110 @@ +/// +/// +module nvd3_test_pieChart { + + var testdata = [ + { key: "One", y: 5, color: "#5F5" }, + { key: "Two", y: 2 }, + { key: "Three", y: 9 }, + { key: "Four", y: 7 }, + { key: "Five", y: 4 }, + { key: "Six", y: 3 }, + { key: "Seven", y: 0.5 } + ]; + var testdata2 = [ + { key: "One", y: 5 }, + { key: "Two", y: 2 }, + { key: "Three", y: 9 }, + { key: "Four", y: 7 }, + { key: "Five", y: 4 }, + { key: "Six", y: 3 }, + { key: "Seven", y: 0.5 } + ]; + + var height = 350; + var width = 350; + + nv.addGraph(function () { + var chart = nv.models.pieChart() + .x(function (d) { return d.key }) + .y(function (d) { return d.y }) + .width(width) + .height(height); + + d3.select("#test1") + .datum(testdata2) + .transition().duration(1200) + .attr('width', width) + .attr('height', height) + .call(chart); + + // update chart data values randomly + setInterval(function () { + testdata2[0].y = Math.floor(Math.random() * 10); + testdata2[1].y = Math.floor(Math.random() * 10); + chart.update(); + }, 4000); + + return chart; + }); + + nv.addGraph(function () { + var chart = nv.models.pieChart() + .x(function (d) { return d.key }) + .y(function (d) { return d.y }) + //.labelThreshold(.08) + //.showLabels(false) + .color(d3.scale.category20().range().slice(8)) + .growOnHover(false) + .labelType('value') + .width(width) + .height(height); + + // make it a half circle + chart.pie + .startAngle(function (d) { return d.startAngle / 2 - Math.PI / 2 }) + .endAngle(function (d) { return d.endAngle / 2 - Math.PI / 2 }); + + // MAKES LABELS OUTSIDE OF PIE/DONUT + //chart.pie.donutLabelsOutside(true).donut(true); + + // LISTEN TO CLICK EVENTS ON SLICES OF THE PIE/DONUT + // chart.pie.dispatch.on('elementClick', function() { + // code... + // }); + + // chart.pie.dispatch.on('chartClick', function() { + // code... + // }); + + // LISTEN TO DOUBLECLICK EVENTS ON SLICES OF THE PIE/DONUT + // chart.pie.dispatch.on('elementDblClick', function() { + // code... + // }); + + // LISTEN TO THE renderEnd EVENT OF THE PIE/DONUT + // chart.pie.dispatch.on('renderEnd', function() { + // code... + // }); + + // OTHER EVENTS DISPATCHED BY THE PIE INCLUDE: elementMouseover, elementMouseout, elementMousemove + // @see nv.models.pie + + d3.select("#test2") + .datum(testdata) + .transition().duration(1200) + .attr('width', width) + .attr('height', height) + .call(chart); + + // disable and enable some of the sections + var is_disabled = false; + setInterval(function () { + chart.dispatch['changeState']({ disabled: { 2: !is_disabled, 4: !is_disabled } }); + is_disabled = !is_disabled; + }, 3000); + + return chart; + }); + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-scatterChart.ts b/nvd3/nvd3-test-scatterChart.ts new file mode 100644 index 0000000000..29ba71cf5a --- /dev/null +++ b/nvd3/nvd3-test-scatterChart.ts @@ -0,0 +1,66 @@ +/// +module nvd3_test_scatterChart { + // register our custom symbols to nvd3 + // make sure your path is valid given any size because size scales if the chart scales. + nv.utils.symbolMap.set('thin-x', function (size) { + size = Math.sqrt(size); + return 'M' + (-size / 2) + ',' + (-size / 2) + + 'l' + size + ',' + size + + 'm0,' + -(size) + + 'l' + (-size) + ',' + size; + }); + + // create the chart + var chart; + nv.addGraph(function () { + chart = nv.models.scatterChart() + .showDistX(true) + .showDistY(true) + .useVoronoi(true) + .color(d3.scale.category10().range()) + .duration(300) + ; + chart.dispatch.on('renderEnd', function () { + console.log('render complete'); + }); + + chart.xAxis.tickFormat(d3.format('.02f')); + chart.yAxis.tickFormat(d3.format('.02f')); + + d3.select('#test1 svg') + .datum(randomData(4, 40)) + .call(chart); + + nv.utils.windowResize(chart.update); + + chart.dispatch.on('stateChange', function (e) { ('New State:', JSON.stringify(e)); }); + return chart; + }); + + + function randomData(groups, points) { //# groups,# points per group + // smiley and thin-x are our custom symbols! + var data = [], + shapes = ['thin-x', 'circle', 'cross', 'triangle-up', 'triangle-down', 'diamond', 'square'], + random = d3.random.normal(); + + for (i = 0; i < groups; i++) { + data.push({ + key: 'Group ' + i, + values: [] + }); + + for (var j = 0; j < points; j++) { + data[i].values.push({ + x: random(), + y: random(), + size: Math.round(Math.random() * 100) / 100, + shape: shapes[j % shapes.length] + }); + } + } + + return data; + } + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-scatterPlusLineChart.ts b/nvd3/nvd3-test-scatterPlusLineChart.ts new file mode 100644 index 0000000000..8238c24042 --- /dev/null +++ b/nvd3/nvd3-test-scatterPlusLineChart.ts @@ -0,0 +1,53 @@ +/// +module nvd3_test_scatterPlusLineChart { + var chart; + nv.addGraph(function () { + chart = nv.models.scatterChart() + .showDistX(true) + .showDistY(true) + .duration(300) + .color(d3.scale.category10().range()); + + chart.dispatch.on('renderEnd', function () { + console.log('render complete'); + }); + + chart.xAxis.tickFormat(d3.format('.02f')); + chart.yAxis.tickFormat(d3.format('.02f')); + + d3.select('#test1 svg') + .datum(nv.log(randomData(4, 40))) + .call(chart); + + nv.utils.windowResize(chart.update); + chart.dispatch.on('stateChange', function (e) { nv.log('New State:', JSON.stringify(e)); }); + return chart; + }); + + + function randomData(groups, points) { //# groups,# points per group + var data = [], + shapes = ['circle'], + random = d3.random.normal(); + + for (i = 0; i < groups; i++) { + data.push({ + key: 'Group ' + i, + values: [], + slope: Math.random() - .01, + intercept: Math.random() - .5 + }); + + for (var j = 0; j < points; j++) { + data[i].values.push({ + x: random(), + y: random(), + size: Math.random(), + shape: shapes[j % shapes.length] + }); + } + } + return data; + } + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-sparkLine.ts b/nvd3/nvd3-test-sparkLine.ts new file mode 100644 index 0000000000..ef872bc2da --- /dev/null +++ b/nvd3/nvd3-test-sparkLine.ts @@ -0,0 +1,27 @@ +/// +module nvd3_test_sparkLine { + + nv.addGraph({ + generate: function () { + var chart = nv.models.sparkline() + .width(400) + .height(30) + + d3.select("#chart1") + .datum(sine()) + .call(chart); + + return chart; + } + }); + + function sine() { + var sin = []; + + for (var i = 0; i < 100; i++) { + sin.push({ x: i, y: Math.sin(i / 10) }); + } + + return sin; + } +} \ No newline at end of file diff --git a/nvd3/nvd3-test-sparkLinePlus.ts b/nvd3/nvd3-test-sparkLinePlus.ts new file mode 100644 index 0000000000..94003e21e1 --- /dev/null +++ b/nvd3/nvd3-test-sparkLinePlus.ts @@ -0,0 +1,54 @@ +/// +module nvd3_test_sparkLinePlus { + function defaultChartConfig(containerId, data) { + nv.addGraph(function () { + + var chart = nv.models.sparklinePlus(); + chart.margin({ left: 70 }) + .x(function (d, i) { return i }) + .showLastValue(true) + .xTickFormat(function (d) { + return d3.time.format('%x')(new Date(data[d].x)) + }); + + d3.select(containerId) + .datum(data) + .call(chart); + + return chart; + }); + } + + defaultChartConfig("#chart1", sine()); + defaultChartConfig("#chart2", volatileChart(130.0, 0.02)); + defaultChartConfig("#chart3", volatileChart(25.0, 0.09, 30)); + + function sine() { + var sin = []; + var now = +new Date(); + + for (var i = 0; i < 100; i++) { + sin.push({ x: now + i * 1000 * 60 * 60 * 24, y: Math.sin(i / 10) }); + } + + return sin; + } + + function volatileChart(startPrice, volatility, numPoints?) { + var rval = []; + var now = +new Date(); + numPoints = numPoints || 100; + for (var i = 1; i < numPoints; i++) { + + rval.push({ x: now + i * 1000 * 60 * 60 * 24, y: startPrice }); + var rnd = Math.random(); + var changePct = 2 * volatility * rnd; + if (changePct > volatility) { + changePct -= (2 * volatility); + } + startPrice = startPrice + startPrice * changePct; + } + return rval; + } + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-stackArea.ts b/nvd3/nvd3-test-stackArea.ts new file mode 100644 index 0000000000..9153de1a43 --- /dev/null +++ b/nvd3/nvd3-test-stackArea.ts @@ -0,0 +1,96 @@ +/// +module nvd3_test_stackArea { + nv.addGraph({ + generate: function () { + var n = 10, // number of layers + m = 200; // number of samples per layer + + //var data = stream_layers(n, m).map(function (data, i) { + // return { + // key: 'Stream' + i, + // values: data + // }; + //}); + var data: any; + + + var width = nv.utils.windowSize().width; + var height = nv.utils.windowSize().height; + + var chart = nv.models.stackedArea() + .width(width) + .height(height); + + var svg = d3.select('#chart svg').datum(data); + svg.transition().duration(500).call(chart); + return chart; + }, + callback: function (graph) { + + graph.dispatch.on('tooltipShow', function (e) { + var offsetElement = document.getElementById("chart"), + left = e.pos[0] + offsetElement.offsetLeft, + top = e.pos[1] + offsetElement.offsetTop, + formatterY = d3.format(",.2%"), + formatterX = function (d) { + return d3.time.format('%x')(new Date(d)) + }; + + var content = '

' + e.series.key + '

' + + '

' + + formatterY(graph.y()(e.point)) + ' at ' + formatterX(graph.x()(e.point)) + + '

'; + + nv.tooltip.show([left, top], content); + }); + + graph.dispatch.on('tooltipHide', function (e) { + nv.tooltip.cleanup(); + }); + + nv.utils.windowResize(function () { + var width = nv.utils.windowSize().width; + var height = nv.utils.windowSize().height; + + graph.width(width).height(height); + d3.select('#chart svg').call(graph); + }); + } + }); + + /* Inspired by Lee Byron's test data generator. */ + function stream_layers(n, m, o) { + if (arguments.length < 3) o = 0; + function bump(a) { + var x = 1 / (.1 + Math.random()), + y = 2 * Math.random() - .5, + z = 10 / (.1 + Math.random()); + for (var i = 0; i < m; i++) { + var w = (i / m - y) * z; + a[i] += x * Math.exp(-w * w); + } + } + return d3.range(n).map(function () { + var a = [], i; + for (i = 0; i < m; i++) a[i] = o + o * Math.random(); + for (i = 0; i < 5; i++) bump(a); + return a.map(stream_index); + }); + } + + /* Another layer generator using gamma distributions. */ + function stream_waves(n, m) { + return d3.range(n).map(function (i) { + return d3.range(m).map(function (j) { + var x = 20 * j / m - i / 3; + return 2 * x * Math.exp(-.5 * x); + }).map(stream_index); + }); + } + + function stream_index(d, i) { + return { x: i, y: Math.max(0, d) }; + } + + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-stackAreaChart.ts b/nvd3/nvd3-test-stackAreaChart.ts new file mode 100644 index 0000000000..f20938680c --- /dev/null +++ b/nvd3/nvd3-test-stackAreaChart.ts @@ -0,0 +1,79 @@ +/// +module nvd3_test_stackAreaChart { + var histcatexplong = [ + { + "key": "Consumer Discretionary", + "values": [[1138683600000, 27.38478809681], [1141102800000, 27.371377218208], [1143781200000, 26.309915460827], [1146369600000, 26.425199957521], [1149048000000, 26.823411519395], [1151640000000, 23.850443591584], [1154318400000, 23.158355444054], [1156996800000, 22.998689393694], [1159588800000, 27.977128511299], [1162270800000, 29.073672469721], [1164862800000, 28.587640408904], [1167541200000, 22.788453687638], [1170219600000, 22.429199073597], [1172638800000, 22.324103271051], [1175313600000, 17.558388444186], [1177905600000, 16.769518096208], [1180584000000, 16.214738201302], [1183176000000, 18.729632971228], [1185854400000, 18.814523318848], [1188532800000, 19.789986451358], [1191124800000, 17.070049054933], [1193803200000, 16.121349575715], [1196398800000, 15.141659430091], [1199077200000, 17.175388025298], [1201755600000, 17.286592443521], [1204261200000, 16.323141626569], [1206936000000, 19.231263773952], [1209528000000, 18.446256391094], [1212206400000, 17.822632399764], [1214798400000, 15.539366475979], [1217476800000, 15.255131790216], [1220155200000, 15.660963922593], [1222747200000, 13.254482273697], [1225425600000, 11.920796202299], [1228021200000, 12.122809090925], [1230699600000, 15.691026271393], [1233378000000, 14.720881635107], [1235797200000, 15.387939360044], [1238472000000, 13.765436672229], [1241064000000, 14.6314458648], [1243742400000, 14.292446536221], [1246334400000, 16.170071367016], [1249012800000, 15.948135554337], [1251691200000, 16.612872685134], [1254283200000, 18.778338719091], [1256961600000, 16.75602606542], [1259557200000, 19.385804443147], [1262235600000, 22.950590240168], [1264914000000, 23.61159018141], [1267333200000, 25.708586989581], [1270008000000, 26.883915999885], [1272600000000, 25.893486687065], [1275278400000, 24.678914263176], [1277870400000, 25.937275793023], [1280548800000, 29.46138169384], [1283227200000, 27.357322961862], [1285819200000, 29.057235285673], [1288497600000, 28.549434189386], [1291093200000, 28.506352379723], [1293771600000, 29.449241421597], [1296450000000, 25.796838168807], [1298869200000, 28.740145449189], [1301544000000, 22.091744141872], [1304136000000, 25.079662545409], [1306814400000, 23.674906973064], [1309406400000, 23.41800274293], [1312084800000, 23.243644138871], [1314763200000, 31.591854066817], [1317355200000, 31.497112374114], [1320033600000, 26.672380820431], [1322629200000, 27.297080015495], [1325307600000, 20.174315530051], [1327986000000, 19.631084213899], [1330491600000, 20.366462219462], [1333166400000, 17.429019937289], [1335758400000, 16.75543633539], [1338436800000, 16.182906906042]] + }, + { + "key": "Consumer Staples", + "values": [[1138683600000, 7.2800122043237], [1141102800000, 7.1187787503354], [1143781200000, 8.351887016482], [1146369600000, 8.4156698763993], [1149048000000, 8.1673298604231], [1151640000000, 5.5132447126042], [1154318400000, 6.1152537710599], [1156996800000, 6.076765091942], [1159588800000, 4.6304473798646], [1162270800000, 4.6301068469402], [1164862800000, 4.3466656309389], [1167541200000, 6.830104897003], [1170219600000, 7.241633040029], [1172638800000, 7.1432372054153], [1175313600000, 10.608942063374], [1177905600000, 10.914964549494], [1180584000000, 10.933223880565], [1183176000000, 8.3457524851265], [1185854400000, 8.1078413081882], [1188532800000, 8.2697185922474], [1191124800000, 8.4742436475968], [1193803200000, 8.4994601179319], [1196398800000, 8.7387319683243], [1199077200000, 6.8829183612895], [1201755600000, 6.984133637885], [1204261200000, 7.0860136043287], [1206936000000, 4.3961787956053], [1209528000000, 3.8699674365231], [1212206400000, 3.6928925238305], [1214798400000, 6.7571718894253], [1217476800000, 6.4367313362344], [1220155200000, 6.4048441521454], [1222747200000, 5.4643833239669], [1225425600000, 5.3150786833374], [1228021200000, 5.3011272612576], [1230699600000, 4.1203601430809], [1233378000000, 4.0881783200525], [1235797200000, 4.1928665957189], [1238472000000, 7.0249415663205], [1241064000000, 7.006530880769], [1243742400000, 6.994835633224], [1246334400000, 6.1220222336254], [1249012800000, 6.1177436137653], [1251691200000, 6.1413396231981], [1254283200000, 4.8046006145874], [1256961600000, 4.6647600660544], [1259557200000, 4.544865006255], [1262235600000, 6.0488249316539], [1264914000000, 6.3188669540206], [1267333200000, 6.5873958262306], [1270008000000, 6.2281189839578], [1272600000000, 5.8948915746059], [1275278400000, 5.5967320482214], [1277870400000, 0.99784432084837], [1280548800000, 1.0950794175359], [1283227200000, 0.94479734407491], [1285819200000, 1.222093988688], [1288497600000, 1.335093106856], [1291093200000, 1.3302565104985], [1293771600000, 1.340824670897], [1296450000000, 0], [1298869200000, 0], [1301544000000, 0], [1304136000000, 0], [1306814400000, 0], [1309406400000, 0], [1312084800000, 0], [1314763200000, 0], [1317355200000, 4.4583692315], [1320033600000, 3.6493043348059], [1322629200000, 3.8610064091761], [1325307600000, 5.5144800685202], [1327986000000, 5.1750695220792], [1330491600000, 5.6710066952691], [1333166400000, 8.5658461590953], [1335758400000, 8.6135447714243], [1338436800000, 8.0231460925212]] + }, + { + "key": "Energy", + "values": [[1138683600000, 1.544303464167], [1141102800000, 1.4387289432421], [1143781200000, 0], [1146369600000, 0], [1149048000000, 0], [1151640000000, 1.328626801128], [1154318400000, 1.2874050802627], [1156996800000, 1.0872743105593], [1159588800000, 0.96042562635813], [1162270800000, 0.93139372870616], [1164862800000, 0.94432167305385], [1167541200000, 1.277750166208], [1170219600000, 1.2204893886811], [1172638800000, 1.207489123122], [1175313600000, 1.2490651414113], [1177905600000, 1.2593129913052], [1180584000000, 1.373329808388], [1183176000000, 0], [1185854400000, 0], [1188532800000, 0], [1191124800000, 0], [1193803200000, 0], [1196398800000, 0], [1199077200000, 0], [1201755600000, 0], [1204261200000, 0], [1206936000000, 0], [1209528000000, 0], [1212206400000, 0], [1214798400000, 0], [1217476800000, 0], [1220155200000, 0], [1222747200000, 1.4516108933695], [1225425600000, 1.1856025268225], [1228021200000, 1.3430470355439], [1230699600000, 2.2752595354509], [1233378000000, 2.4031560010523], [1235797200000, 2.0822430731926], [1238472000000, 1.5640902826938], [1241064000000, 1.5812873972356], [1243742400000, 1.9462448548894], [1246334400000, 2.9464870223957], [1249012800000, 3.0744699383222], [1251691200000, 2.9422304628446], [1254283200000, 2.7503075599999], [1256961600000, 2.6506701800427], [1259557200000, 2.8005425319977], [1262235600000, 2.6816184971185], [1264914000000, 2.681206271327], [1267333200000, 2.8195488011259], [1270008000000, 0], [1272600000000, 0], [1275278400000, 0], [1277870400000, 1.0687057346382], [1280548800000, 1.2539400544134], [1283227200000, 1.1862969445955], [1285819200000, 0], [1288497600000, 0], [1291093200000, 0], [1293771600000, 0], [1296450000000, 1.941972859484], [1298869200000, 2.1142247697552], [1301544000000, 2.3788590206824], [1304136000000, 2.5337302877545], [1306814400000, 2.3163370395199], [1309406400000, 2.0645451843195], [1312084800000, 2.1004446672411], [1314763200000, 3.6301875804303], [1317355200000, 2.454204664652], [1320033600000, 2.196082370894], [1322629200000, 2.3358418255202], [1325307600000, 0], [1327986000000, 0], [1330491600000, 0], [1333166400000, 0.39001201038526], [1335758400000, 0.30945472725559], [1338436800000, 0.31062439305591]] + }, + { + "key": "Financials", + "values": [[1138683600000, 13.356778764352], [1141102800000, 13.611196863271], [1143781200000, 6.895903006119], [1146369600000, 6.9939633271352], [1149048000000, 6.7241510257675], [1151640000000, 5.5611293669516], [1154318400000, 5.6086488714041], [1156996800000, 5.4962849907033], [1159588800000, 6.9193153169279], [1162270800000, 7.0016334389777], [1164862800000, 6.7865422443273], [1167541200000, 9.0006454225383], [1170219600000, 9.2233916171431], [1172638800000, 8.8929316009479], [1175313600000, 10.345937520404], [1177905600000, 10.075914677026], [1180584000000, 10.089006188111], [1183176000000, 10.598330295008], [1185854400000, 9.968954653301], [1188532800000, 9.7740580198146], [1191124800000, 10.558483060626], [1193803200000, 9.9314651823603], [1196398800000, 9.3997715873769], [1199077200000, 8.4086493387262], [1201755600000, 8.9698309085926], [1204261200000, 8.2778357995396], [1206936000000, 8.8585045600123], [1209528000000, 8.7013756413322], [1212206400000, 7.7933605469443], [1214798400000, 7.0236183483064], [1217476800000, 6.9873088186829], [1220155200000, 6.8031713070097], [1222747200000, 6.6869531315723], [1225425600000, 6.138256993963], [1228021200000, 5.6434994016354], [1230699600000, 5.495220262512], [1233378000000, 4.6885326869846], [1235797200000, 4.4524349883438], [1238472000000, 5.6766520778185], [1241064000000, 5.7675774480752], [1243742400000, 5.7882863168337], [1246334400000, 7.2666010034924], [1249012800000, 7.519182132226], [1251691200000, 7.849651451445], [1254283200000, 10.383992037985], [1256961600000, 9.0653691861818], [1259557200000, 9.6705248324159], [1262235600000, 10.856380561349], [1264914000000, 11.27452370892], [1267333200000, 11.754156529088], [1270008000000, 8.2870811422456], [1272600000000, 8.0210264360699], [1275278400000, 7.5375074474865], [1277870400000, 8.3419527338039], [1280548800000, 9.4197471818443], [1283227200000, 8.7321733185797], [1285819200000, 9.6627062648126], [1288497600000, 10.187962234549], [1291093200000, 9.8144201733476], [1293771600000, 10.275723361713], [1296450000000, 16.796066079353], [1298869200000, 17.543254984075], [1301544000000, 16.673660675084], [1304136000000, 17.963944353609], [1306814400000, 16.637740867211], [1309406400000, 15.84857094609], [1312084800000, 14.767303362182], [1314763200000, 24.778452182432], [1317355200000, 18.370353229999], [1320033600000, 15.2531374291], [1322629200000, 14.989600840649], [1325307600000, 16.052539160125], [1327986000000, 16.424390322793], [1330491600000, 17.884020741105], [1333166400000, 7.1424929577921], [1335758400000, 7.8076213051482], [1338436800000, 7.2462684949232]] + }, + { + "key": "Health Care", + "values": [[1138683600000, 14.212410956029], [1141102800000, 13.973193618249], [1143781200000, 15.218233920665], [1146369600000, 14.38210972745], [1149048000000, 13.894310878491], [1151640000000, 15.593086090032], [1154318400000, 16.244839695188], [1156996800000, 16.017088850646], [1159588800000, 14.183951830055], [1162270800000, 14.148523245697], [1164862800000, 13.424326059972], [1167541200000, 12.974450435753], [1170219600000, 13.23247041802], [1172638800000, 13.318762655574], [1175313600000, 15.961407746104], [1177905600000, 16.287714639805], [1180584000000, 16.246590583889], [1183176000000, 17.564505594809], [1185854400000, 17.872725373165], [1188532800000, 18.018998508757], [1191124800000, 15.584518016603], [1193803200000, 15.480850647181], [1196398800000, 15.699120036984], [1199077200000, 19.184281817226], [1201755600000, 19.691226605207], [1204261200000, 18.982314051295], [1206936000000, 18.707820309008], [1209528000000, 17.459630929761], [1212206400000, 16.500616076782], [1214798400000, 18.086324003979], [1217476800000, 18.929464156258], [1220155200000, 18.233728682084], [1222747200000, 16.315776297325], [1225425600000, 14.63289219025], [1228021200000, 14.667835024478], [1230699600000, 13.946993947308], [1233378000000, 14.394304684397], [1235797200000, 13.724462792967], [1238472000000, 10.930879035806], [1241064000000, 9.8339915513708], [1243742400000, 10.053858541872], [1246334400000, 11.786998438287], [1249012800000, 11.780994901769], [1251691200000, 11.305889670276], [1254283200000, 10.918452290083], [1256961600000, 9.6811395055706], [1259557200000, 10.971529744038], [1262235600000, 13.330210480209], [1264914000000, 14.592637568961], [1267333200000, 14.605329141157], [1270008000000, 13.936853794037], [1272600000000, 12.189480759072], [1275278400000, 11.676151385046], [1277870400000, 13.058852800017], [1280548800000, 13.62891543203], [1283227200000, 13.811107569918], [1285819200000, 13.786494560787], [1288497600000, 14.04516285753], [1291093200000, 13.697412447288], [1293771600000, 13.677681376221], [1296450000000, 19.961511864531], [1298869200000, 21.049198298158], [1301544000000, 22.687631094008], [1304136000000, 25.469010617433], [1306814400000, 24.883799437121], [1309406400000, 24.203843814248], [1312084800000, 22.138760964038], [1314763200000, 16.034636966228], [1317355200000, 15.394958944556], [1320033600000, 12.625642461969], [1322629200000, 12.973735699739], [1325307600000, 15.786018336149], [1327986000000, 15.227368020134], [1330491600000, 15.899752650734], [1333166400000, 18.994731295388], [1335758400000, 18.450055817702], [1338436800000, 17.863719889669]] + }, + { + "key": "Industrials", + "values": [[1138683600000, 7.1590087090398], [1141102800000, 7.1297210970108], [1143781200000, 5.5774588290586], [1146369600000, 5.4977254491156], [1149048000000, 5.5138153113634], [1151640000000, 4.3198084032122], [1154318400000, 3.9179295839125], [1156996800000, 3.8110093051479], [1159588800000, 5.5629020916939], [1162270800000, 5.7241673711336], [1164862800000, 5.4715049695004], [1167541200000, 4.9193763571618], [1170219600000, 5.136053947247], [1172638800000, 5.1327258759766], [1175313600000, 5.1888943925082], [1177905600000, 5.5191481293345], [1180584000000, 5.6093625614921], [1183176000000, 4.2706312987397], [1185854400000, 4.4453235132117], [1188532800000, 4.6228003109761], [1191124800000, 5.0645764756954], [1193803200000, 5.0723447230959], [1196398800000, 5.1457765818846], [1199077200000, 5.4067851597282], [1201755600000, 5.472241916816], [1204261200000, 5.3742740389688], [1206936000000, 6.251751933664], [1209528000000, 6.1406852153472], [1212206400000, 5.8164385627465], [1214798400000, 5.4255846656171], [1217476800000, 5.3738499417204], [1220155200000, 5.1815627753979], [1222747200000, 5.0305983235349], [1225425600000, 4.6823058607165], [1228021200000, 4.5941481589093], [1230699600000, 5.4669598474575], [1233378000000, 5.1249037357], [1235797200000, 4.3504421250742], [1238472000000, 4.6260881026002], [1241064000000, 5.0140402458946], [1243742400000, 4.7458462454774], [1246334400000, 6.0437019654564], [1249012800000, 6.4595216249754], [1251691200000, 6.6420468254155], [1254283200000, 5.8927271960913], [1256961600000, 5.4712108838003], [1259557200000, 6.1220254207747], [1262235600000, 5.5385935169255], [1264914000000, 5.7383377612639], [1267333200000, 6.1715976730415], [1270008000000, 4.0102262681174], [1272600000000, 3.769389679692], [1275278400000, 3.5301571031152], [1277870400000, 2.7660252652526], [1280548800000, 3.1409983385775], [1283227200000, 3.0528024863055], [1285819200000, 4.3126123157971], [1288497600000, 4.594654041683], [1291093200000, 4.5424126126793], [1293771600000, 4.7790043987302], [1296450000000, 7.4969154058289], [1298869200000, 7.9424751557821], [1301544000000, 7.1560736250547], [1304136000000, 7.9478117337855], [1306814400000, 7.4109214848895], [1309406400000, 7.5966457641101], [1312084800000, 7.165754444071], [1314763200000, 5.4816702524302], [1317355200000, 4.9893656089584], [1320033600000, 4.498385105327], [1322629200000, 4.6776090358151], [1325307600000, 8.1350814368063], [1327986000000, 8.0732769990652], [1330491600000, 8.5602340387277], [1333166400000, 5.1293714074325], [1335758400000, 5.2586794619016], [1338436800000, 5.1100853569977]] + }, + { + "key": "Information Technology", + "values": [[1138683600000, 13.242301508051], [1141102800000, 12.863536342042], [1143781200000, 21.034044171629], [1146369600000, 21.419084618803], [1149048000000, 21.142678863691], [1151640000000, 26.568489677529], [1154318400000, 24.839144939905], [1156996800000, 25.456187462167], [1159588800000, 26.350164502826], [1162270800000, 26.47833320519], [1164862800000, 26.425979547847], [1167541200000, 28.191461582256], [1170219600000, 28.930307448808], [1172638800000, 29.521413891117], [1175313600000, 28.188285966466], [1177905600000, 27.704619625832], [1180584000000, 27.490862424829], [1183176000000, 28.770679721286], [1185854400000, 29.060480671449], [1188532800000, 28.240998844973], [1191124800000, 33.004893194127], [1193803200000, 34.075180359928], [1196398800000, 32.548560664833], [1199077200000, 30.629727432728], [1201755600000, 28.642858788159], [1204261200000, 27.973575227842], [1206936000000, 27.393351882726], [1209528000000, 28.476095288523], [1212206400000, 29.29667866426], [1214798400000, 29.222333802896], [1217476800000, 28.092966093843], [1220155200000, 28.107159262922], [1222747200000, 25.482974832098], [1225425600000, 21.208115993834], [1228021200000, 20.295043095268], [1230699600000, 15.925754618401], [1233378000000, 17.162864628346], [1235797200000, 17.084345773174], [1238472000000, 22.246007102281], [1241064000000, 24.530543998509], [1243742400000, 25.084184918242], [1246334400000, 16.606166527358], [1249012800000, 17.239620011628], [1251691200000, 17.336739127379], [1254283200000, 25.478492475753], [1256961600000, 23.017152085245], [1259557200000, 25.617745423683], [1262235600000, 24.061133998642], [1264914000000, 23.223933318644], [1267333200000, 24.425887263937], [1270008000000, 35.501471156693], [1272600000000, 33.775013878676], [1275278400000, 30.417993630285], [1277870400000, 30.023598978467], [1280548800000, 33.327519522436], [1283227200000, 31.963388450371], [1285819200000, 30.498967232092], [1288497600000, 32.403696817912], [1291093200000, 31.47736071922], [1293771600000, 31.53259666241], [1296450000000, 41.760282761548], [1298869200000, 45.605771243237], [1301544000000, 39.986557966215], [1304136000000, 43.846330510051], [1306814400000, 39.857316881857], [1309406400000, 37.675127768208], [1312084800000, 35.775077970313], [1314763200000, 48.631009702577], [1317355200000, 42.830831754505], [1320033600000, 35.611502589362], [1322629200000, 35.320136981738], [1325307600000, 31.564136901516], [1327986000000, 32.074407502433], [1330491600000, 35.053013769976], [1333166400000, 26.434568573937], [1335758400000, 25.305617871002], [1338436800000, 24.520919418236]] + }, + { + "key": "Materials", + "values": [[1138683600000, 5.5806167415681], [1141102800000, 5.4539047069985], [1143781200000, 7.6728842432362], [1146369600000, 7.719946716654], [1149048000000, 8.0144619912942], [1151640000000, 7.942223133434], [1154318400000, 8.3998279827444], [1156996800000, 8.532324572605], [1159588800000, 4.7324285199763], [1162270800000, 4.7402397487697], [1164862800000, 4.9042069355168], [1167541200000, 5.9583963430882], [1170219600000, 6.3693899239171], [1172638800000, 6.261153903813], [1175313600000, 5.3443942184584], [1177905600000, 5.4932111235361], [1180584000000, 5.5747393101109], [1183176000000, 5.3833633060013], [1185854400000, 5.5125898831832], [1188532800000, 5.8116112661327], [1191124800000, 4.3962296939996], [1193803200000, 4.6967663605521], [1196398800000, 4.7963004350914], [1199077200000, 4.1817985183351], [1201755600000, 4.3797643870182], [1204261200000, 4.6966642197965], [1206936000000, 4.3609995132565], [1209528000000, 4.4736290996496], [1212206400000, 4.3749762738128], [1214798400000, 3.3274661194507], [1217476800000, 3.0316184691337], [1220155200000, 2.5718140204728], [1222747200000, 2.7034994044603], [1225425600000, 2.2033786591364], [1228021200000, 1.9850621240805], [1230699600000, 0], [1233378000000, 0], [1235797200000, 0], [1238472000000, 0], [1241064000000, 0], [1243742400000, 0], [1246334400000, 0], [1249012800000, 0], [1251691200000, 0], [1254283200000, 0.44495950017788], [1256961600000, 0.33945469262483], [1259557200000, 0.38348269455195], [1262235600000, 0], [1264914000000, 0], [1267333200000, 0], [1270008000000, 0], [1272600000000, 0], [1275278400000, 0], [1277870400000, 0], [1280548800000, 0], [1283227200000, 0], [1285819200000, 0], [1288497600000, 0], [1291093200000, 0], [1293771600000, 0], [1296450000000, 0.52216435716176], [1298869200000, 0.59275786698454], [1301544000000, 0], [1304136000000, 0], [1306814400000, 0], [1309406400000, 0], [1312084800000, 0], [1314763200000, 0], [1317355200000, 0], [1320033600000, 0], [1322629200000, 0], [1325307600000, 0], [1327986000000, 0], [1330491600000, 0], [1333166400000, 0], [1335758400000, 0], [1338436800000, 0]] + }, + { + "key": "Telecommunication Services", + "values": [[1138683600000, 3.7056975170243], [1141102800000, 3.7561118692318], [1143781200000, 2.861913700854], [1146369600000, 2.9933744103381], [1149048000000, 2.7127537218463], [1151640000000, 3.1195497076283], [1154318400000, 3.4066964004508], [1156996800000, 3.3754571113569], [1159588800000, 2.2965579982924], [1162270800000, 2.4486818633018], [1164862800000, 2.4002308848517], [1167541200000, 1.9649579750349], [1170219600000, 1.9385263638056], [1172638800000, 1.9128975336387], [1175313600000, 2.3412869836298], [1177905600000, 2.4337870351445], [1180584000000, 2.62179703171], [1183176000000, 3.2642864957929], [1185854400000, 3.3200396223709], [1188532800000, 3.3934212707572], [1191124800000, 4.2822327088179], [1193803200000, 4.1474964228541], [1196398800000, 4.1477082879801], [1199077200000, 5.2947122916128], [1201755600000, 5.2919843508028], [1204261200000, 5.1989783050309], [1206936000000, 3.5603057673513], [1209528000000, 3.3009087690692], [1212206400000, 3.1784852603792], [1214798400000, 4.5889503538868], [1217476800000, 4.401779617494], [1220155200000, 4.2208301828278], [1222747200000, 3.89396671475], [1225425600000, 3.0423832241354], [1228021200000, 3.135520611578], [1230699600000, 1.9631418164089], [1233378000000, 1.8963543874958], [1235797200000, 1.8266636017025], [1238472000000, 0.93136635895188], [1241064000000, 0.92737801918888], [1243742400000, 0.97591889805002], [1246334400000, 2.6841193805515], [1249012800000, 2.5664341140531], [1251691200000, 2.3887523699873], [1254283200000, 1.1737801663681], [1256961600000, 1.0953582317281], [1259557200000, 1.2495674976653], [1262235600000, 0.36607452464754], [1264914000000, 0.3548719047291], [1267333200000, 0.36769242398939], [1270008000000, 0], [1272600000000, 0], [1275278400000, 0], [1277870400000, 0], [1280548800000, 0], [1283227200000, 0], [1285819200000, 0.85450741275337], [1288497600000, 0.91360317921637], [1291093200000, 0.89647678692269], [1293771600000, 0.87800687192639], [1296450000000, 0], [1298869200000, 0], [1301544000000, 0.43668720882994], [1304136000000, 0.4756523602692], [1306814400000, 0.46947368328469], [1309406400000, 0.45138896152316], [1312084800000, 0.43828726648117], [1314763200000, 2.0820861395316], [1317355200000, 0.9364411075395], [1320033600000, 0.60583907839773], [1322629200000, 0.61096950747437], [1325307600000, 0], [1327986000000, 0], [1330491600000, 0], [1333166400000, 0], [1335758400000, 0], [1338436800000, 0]] + }, + { + "key": "Utilities", + "values": [[1138683600000, 0], [1141102800000, 0], [1143781200000, 0], [1146369600000, 0], [1149048000000, 0], [1151640000000, 0], [1154318400000, 0], [1156996800000, 0], [1159588800000, 0], [1162270800000, 0], [1164862800000, 0], [1167541200000, 0], [1170219600000, 0], [1172638800000, 0], [1175313600000, 0], [1177905600000, 0], [1180584000000, 0], [1183176000000, 0], [1185854400000, 0], [1188532800000, 0], [1191124800000, 0], [1193803200000, 0], [1196398800000, 0], [1199077200000, 0], [1201755600000, 0], [1204261200000, 0], [1206936000000, 0], [1209528000000, 0], [1212206400000, 0], [1214798400000, 0], [1217476800000, 0], [1220155200000, 0], [1222747200000, 0], [1225425600000, 0], [1228021200000, 0], [1230699600000, 0], [1233378000000, 0], [1235797200000, 0], [1238472000000, 0], [1241064000000, 0], [1243742400000, 0], [1246334400000, 0], [1249012800000, 0], [1251691200000, 0], [1254283200000, 0], [1256961600000, 0], [1259557200000, 0], [1262235600000, 0], [1264914000000, 0], [1267333200000, 0], [1270008000000, 0], [1272600000000, 0], [1275278400000, 0], [1277870400000, 0], [1280548800000, 0], [1283227200000, 0], [1285819200000, 0], [1288497600000, 0], [1291093200000, 0], [1293771600000, 0], [1296450000000, 0], [1298869200000, 0], [1301544000000, 0], [1304136000000, 0], [1306814400000, 0], [1309406400000, 0], [1312084800000, 0], [1314763200000, 0], [1317355200000, 0], [1320033600000, 0], [1322629200000, 0], [1325307600000, 0], [1327986000000, 0], [1330491600000, 0], [1333166400000, 0], [1335758400000, 0], [1338436800000, 0]] + } + ]; + + var colors = d3.scale.category20(); + + var chart; + nv.addGraph(function () { + chart = nv.models.stackedAreaChart() + .useInteractiveGuideline(true) + .x(function (d) { return d[0] }) + .y(function (d) { return d[1] }) + .controlLabels({ stacked: "Stacked" }) + .duration(300); + + chart.xAxis.tickFormat(function (d) { return d3.time.format('%x')(new Date(d)) }); + chart.yAxis.tickFormat(d3.format(',.4f')); + + chart.legend.vers('furious'); + + d3.select('#chart1') + .datum(histcatexplong) + .transition().duration(1000) + .call(chart) + .each('start', function () { + setTimeout(function () { + d3.selectAll('#chart1 *').each(function () { + if (this.__transition__) + this.__transition__.duration = 1; + }) + }, 0) + }); + + nv.utils.windowResize(chart.update); + return chart; + }); + +} \ No newline at end of file diff --git a/nvd3/nvd3-test-sunburst.ts b/nvd3/nvd3-test-sunburst.ts new file mode 100644 index 0000000000..cb299e0849 --- /dev/null +++ b/nvd3/nvd3-test-sunburst.ts @@ -0,0 +1,402 @@ +/// +module nvd3_test_sunburst { + + var chart; + + nv.addGraph(function () { + chart = nv.models.sunburstChart(); + + chart.color(d3.scale.category20c()); + + d3.select("#test1") + .datum(getData()) + .call(chart); + + nv.utils.windowResize(chart.update); + + return chart; + }); + + function getData() { + return [{ + "name": "flare", + "children": [ + { + "name": "analytics", + "children": [ + { + "name": "cluster", + "children": [ + { "name": "AgglomerativeCluster", "size": 3938 }, + { "name": "CommunityStructure", "size": 3812 }, + { "name": "HierarchicalCluster", "size": 6714 }, + { "name": "MergeEdge", "size": 743 } + ] + }, + { + "name": "graph", + "children": [ + { "name": "BetweennessCentrality", "size": 3534 }, + { "name": "LinkDistance", "size": 5731 }, + { "name": "MaxFlowMinCut", "size": 7840 }, + { "name": "ShortestPaths", "size": 5914 }, + { "name": "SpanningTree", "size": 3416 } + ] + }, + { + "name": "optimization", + "children": [ + { "name": "AspectRatioBanker", "size": 7074 } + ] + } + ] + }, + { + "name": "animate", + "children": [ + { "name": "Easing", "size": 17010 }, + { "name": "FunctionSequence", "size": 5842 }, + { + "name": "interpolate", + "children": [ + { "name": "ArrayInterpolator", "size": 1983 }, + { "name": "ColorInterpolator", "size": 2047 }, + { "name": "DateInterpolator", "size": 1375 }, + { "name": "Interpolator", "size": 8746 }, + { "name": "MatrixInterpolator", "size": 2202 }, + { "name": "NumberInterpolator", "size": 1382 }, + { "name": "ObjectInterpolator", "size": 1629 }, + { "name": "PointInterpolator", "size": 1675 }, + { "name": "RectangleInterpolator", "size": 2042 } + ] + }, + { "name": "ISchedulable", "size": 1041 }, + { "name": "Parallel", "size": 5176 }, + { "name": "Pause", "size": 449 }, + { "name": "Scheduler", "size": 5593 }, + { "name": "Sequence", "size": 5534 }, + { "name": "Transition", "size": 9201 }, + { "name": "Transitioner", "size": 19975 }, + { "name": "TransitionEvent", "size": 1116 }, + { "name": "Tween", "size": 6006 } + ] + }, + { + "name": "data", + "children": [ + { + "name": "converters", + "children": [ + { "name": "Converters", "size": 721 }, + { "name": "DelimitedTextConverter", "size": 4294 }, + { "name": "GraphMLConverter", "size": 9800 }, + { "name": "IDataConverter", "size": 1314 }, + { "name": "JSONConverter", "size": 2220 } + ] + }, + { "name": "DataField", "size": 1759 }, + { "name": "DataSchema", "size": 2165 }, + { "name": "DataSet", "size": 586 }, + { "name": "DataSource", "size": 3331 }, + { "name": "DataTable", "size": 772 }, + { "name": "DataUtil", "size": 3322 } + ] + }, + { + "name": "display", + "children": [ + { "name": "DirtySprite", "size": 8833 }, + { "name": "LineSprite", "size": 1732 }, + { "name": "RectSprite", "size": 3623 }, + { "name": "TextSprite", "size": 10066 } + ] + }, + { + "name": "flex", + "children": [ + { "name": "FlareVis", "size": 4116 } + ] + }, + { + "name": "physics", + "children": [ + { "name": "DragForce", "size": 1082 }, + { "name": "GravityForce", "size": 1336 }, + { "name": "IForce", "size": 319 }, + { "name": "NBodyForce", "size": 10498 }, + { "name": "Particle", "size": 2822 }, + { "name": "Simulation", "size": 9983 }, + { "name": "Spring", "size": 2213 }, + { "name": "SpringForce", "size": 1681 } + ] + }, + { + "name": "query", + "children": [ + { "name": "AggregateExpression", "size": 1616 }, + { "name": "And", "size": 1027 }, + { "name": "Arithmetic", "size": 3891 }, + { "name": "Average", "size": 891 }, + { "name": "BinaryExpression", "size": 2893 }, + { "name": "Comparison", "size": 5103 }, + { "name": "CompositeExpression", "size": 3677 }, + { "name": "Count", "size": 781 }, + { "name": "DateUtil", "size": 4141 }, + { "name": "Distinct", "size": 933 }, + { "name": "Expression", "size": 5130 }, + { "name": "ExpressionIterator", "size": 3617 }, + { "name": "Fn", "size": 3240 }, + { "name": "If", "size": 2732 }, + { "name": "IsA", "size": 2039 }, + { "name": "Literal", "size": 1214 }, + { "name": "Match", "size": 3748 }, + { "name": "Maximum", "size": 843 }, + { + "name": "methods", + "children": [ + { "name": "add", "size": 593 }, + { "name": "and", "size": 330 }, + { "name": "average", "size": 287 }, + { "name": "count", "size": 277 }, + { "name": "distinct", "size": 292 }, + { "name": "div", "size": 595 }, + { "name": "eq", "size": 594 }, + { "name": "fn", "size": 460 }, + { "name": "gt", "size": 603 }, + { "name": "gte", "size": 625 }, + { "name": "iff", "size": 748 }, + { "name": "isa", "size": 461 }, + { "name": "lt", "size": 597 }, + { "name": "lte", "size": 619 }, + { "name": "max", "size": 283 }, + { "name": "min", "size": 283 }, + { "name": "mod", "size": 591 }, + { "name": "mul", "size": 603 }, + { "name": "neq", "size": 599 }, + { "name": "not", "size": 386 }, + { "name": "or", "size": 323 }, + { "name": "orderby", "size": 307 }, + { "name": "range", "size": 772 }, + { "name": "select", "size": 296 }, + { "name": "stddev", "size": 363 }, + { "name": "sub", "size": 600 }, + { "name": "sum", "size": 280 }, + { "name": "update", "size": 307 }, + { "name": "variance", "size": 335 }, + { "name": "where", "size": 299 }, + { "name": "xor", "size": 354 }, + { "name": "_", "size": 264 } + ] + }, + { "name": "Minimum", "size": 843 }, + { "name": "Not", "size": 1554 }, + { "name": "Or", "size": 970 }, + { "name": "Query", "size": 13896 }, + { "name": "Range", "size": 1594 }, + { "name": "StringUtil", "size": 4130 }, + { "name": "Sum", "size": 791 }, + { "name": "Variable", "size": 1124 }, + { "name": "Variance", "size": 1876 }, + { "name": "Xor", "size": 1101 } + ] + }, + { + "name": "scale", + "children": [ + { "name": "IScaleMap", "size": 2105 }, + { "name": "LinearScale", "size": 1316 }, + { "name": "LogScale", "size": 3151 }, + { "name": "OrdinalScale", "size": 3770 }, + { "name": "QuantileScale", "size": 2435 }, + { "name": "QuantitativeScale", "size": 4839 }, + { "name": "RootScale", "size": 1756 }, + { "name": "Scale", "size": 4268 }, + { "name": "ScaleType", "size": 1821 }, + { "name": "TimeScale", "size": 5833 } + ] + }, + { + "name": "util", + "children": [ + { "name": "Arrays", "size": 8258 }, + { "name": "Colors", "size": 10001 }, + { "name": "Dates", "size": 8217 }, + { "name": "Displays", "size": 12555 }, + { "name": "Filter", "size": 2324 }, + { "name": "Geometry", "size": 10993 }, + { + "name": "heap", + "children": [ + { "name": "FibonacciHeap", "size": 9354 }, + { "name": "HeapNode", "size": 1233 } + ] + }, + { "name": "IEvaluable", "size": 335 }, + { "name": "IPredicate", "size": 383 }, + { "name": "IValueProxy", "size": 874 }, + { + "name": "math", + "children": [ + { "name": "DenseMatrix", "size": 3165 }, + { "name": "IMatrix", "size": 2815 }, + { "name": "SparseMatrix", "size": 3366 } + ] + }, + { "name": "Maths", "size": 17705 }, + { "name": "Orientation", "size": 1486 }, + { + "name": "palette", + "children": [ + { "name": "ColorPalette", "size": 6367 }, + { "name": "Palette", "size": 1229 }, + { "name": "ShapePalette", "size": 2059 }, + { "name": "SizePalette", "size": 2291 } + ] + }, + { "name": "Property", "size": 5559 }, + { "name": "Shapes", "size": 19118 }, + { "name": "Sort", "size": 6887 }, + { "name": "Stats", "size": 6557 }, + { "name": "Strings", "size": 22026 } + ] + }, + { + "name": "vis", + "children": [ + { + "name": "axis", + "children": [ + { "name": "Axes", "size": 1302 }, + { "name": "Axis", "size": 24593 }, + { "name": "AxisGridLine", "size": 652 }, + { "name": "AxisLabel", "size": 636 }, + { "name": "CartesianAxes", "size": 6703 } + ] + }, + { + "name": "controls", + "children": [ + { "name": "AnchorControl", "size": 2138 }, + { "name": "ClickControl", "size": 3824 }, + { "name": "Control", "size": 1353 }, + { "name": "ControlList", "size": 4665 }, + { "name": "DragControl", "size": 2649 }, + { "name": "ExpandControl", "size": 2832 }, + { "name": "HoverControl", "size": 4896 }, + { "name": "IControl", "size": 763 }, + { "name": "PanZoomControl", "size": 5222 }, + { "name": "SelectionControl", "size": 7862 }, + { "name": "TooltipControl", "size": 8435 } + ] + }, + { + "name": "data", + "children": [ + { "name": "Data", "size": 20544 }, + { "name": "DataList", "size": 19788 }, + { "name": "DataSprite", "size": 10349 }, + { "name": "EdgeSprite", "size": 3301 }, + { "name": "NodeSprite", "size": 19382 }, + { + "name": "render", + "children": [ + { "name": "ArrowType", "size": 698 }, + { "name": "EdgeRenderer", "size": 5569 }, + { "name": "IRenderer", "size": 353 }, + { "name": "ShapeRenderer", "size": 2247 } + ] + }, + { "name": "ScaleBinding", "size": 11275 }, + { "name": "Tree", "size": 7147 }, + { "name": "TreeBuilder", "size": 9930 } + ] + }, + { + "name": "events", + "children": [ + { "name": "DataEvent", "size": 2313 }, + { "name": "SelectionEvent", "size": 1880 }, + { "name": "TooltipEvent", "size": 1701 }, + { "name": "VisualizationEvent", "size": 1117 } + ] + }, + { + "name": "legend", + "children": [ + { "name": "Legend", "size": 20859 }, + { "name": "LegendItem", "size": 4614 }, + { "name": "LegendRange", "size": 10530 } + ] + }, + { + "name": "operator", + "children": [ + { + "name": "distortion", + "children": [ + { "name": "BifocalDistortion", "size": 4461 }, + { "name": "Distortion", "size": 6314 }, + { "name": "FisheyeDistortion", "size": 3444 } + ] + }, + { + "name": "encoder", + "children": [ + { "name": "ColorEncoder", "size": 3179 }, + { "name": "Encoder", "size": 4060 }, + { "name": "PropertyEncoder", "size": 4138 }, + { "name": "ShapeEncoder", "size": 1690 }, + { "name": "SizeEncoder", "size": 1830 } + ] + }, + { + "name": "filter", + "children": [ + { "name": "FisheyeTreeFilter", "size": 5219 }, + { "name": "GraphDistanceFilter", "size": 3165 }, + { "name": "VisibilityFilter", "size": 3509 } + ] + }, + { "name": "IOperator", "size": 1286 }, + { + "name": "label", + "children": [ + { "name": "Labeler", "size": 9956 }, + { "name": "RadialLabeler", "size": 3899 }, + { "name": "StackedAreaLabeler", "size": 3202 } + ] + }, + { + "name": "layout", + "children": [ + { "name": "AxisLayout", "size": 6725 }, + { "name": "BundledEdgeRouter", "size": 3727 }, + { "name": "CircleLayout", "size": 9317 }, + { "name": "CirclePackingLayout", "size": 12003 }, + { "name": "DendrogramLayout", "size": 4853 }, + { "name": "ForceDirectedLayout", "size": 8411 }, + { "name": "IcicleTreeLayout", "size": 4864 }, + { "name": "IndentedTreeLayout", "size": 3174 }, + { "name": "Layout", "size": 7881 }, + { "name": "NodeLinkTreeLayout", "size": 12870 }, + { "name": "PieLayout", "size": 2728 }, + { "name": "RadialTreeLayout", "size": 12348 }, + { "name": "RandomLayout", "size": 870 }, + { "name": "StackedAreaLayout", "size": 9121 }, + { "name": "TreeMapLayout", "size": 9191 } + ] + }, + { "name": "Operator", "size": 2490 }, + { "name": "OperatorList", "size": 5248 }, + { "name": "OperatorSequence", "size": 4190 }, + { "name": "OperatorSwitch", "size": 2581 }, + { "name": "SortOperator", "size": 2023 } + ] + }, + { "name": "Visualization", "size": 16540 } + ] + } + ] + }]; + } +} \ No newline at end of file diff --git a/nvd3/nvd3-test-timeSeries.ts b/nvd3/nvd3-test-timeSeries.ts new file mode 100644 index 0000000000..2eec0dcbd2 --- /dev/null +++ b/nvd3/nvd3-test-timeSeries.ts @@ -0,0 +1,167 @@ +/// +module nvd3_test_timeSeries { + var data = [{ + values: [] + }]; + + var i, x; + var gap = false; + var prevVal = 3000; + var tickCount = 100; + var probEnterGap = 0.1; + var probExitGap = 0.2; + var barTimespan = 30 * 60; // thirty minutes in seconds + var startOfTime = 1425096000; + for (i = 0; i < tickCount; i++) { + x = startOfTime + i * barTimespan; + if (!gap) { + if (Math.random() > probEnterGap) { + prevVal += (Math.random() - 0.5) * 500; + if (prevVal <= 0) { + prevVal = Math.random() * 100; + } + data[0].values.push({ x: x * 1000, y: prevVal }); + } + else { + gap = true; + } + } + else { + if (Math.random() < probExitGap) { + gap = false; + } + } + } + + var chart; + + var halfBarXMin = data[0].values[0].x - barTimespan / 2 * 1000; + var halfBarXMax = data[0].values[data[0].values.length - 1].x + barTimespan / 2 * 1000; + + function renderChart(location, meaning) { + nv.addGraph(function () { + chart = nv.models.historicalBarChart(); + chart + .xScale(d3.time.scale()) // use a time scale instead of plain numbers in order to get nice round default values in the axis + .color(['#68c']) + .forceX([halfBarXMin, halfBarXMax]) // fix half-bar problem on the first and last bars + .useInteractiveGuideline(true) // check out the css that turns the guideline into this nice thing + .margin({ "left": 80, "right": 50, "top": 20, "bottom": 30 }) + .duration(0) + ; + + var tickMultiFormat = d3.time.format.multi([ + ["%-I:%M%p", function (d) { return d.getMinutes(); }], // not the beginning of the hour + ["%-I%p", function (d) { return d.getHours(); }], // not midnight + ["%b %-d", function (d) { return d.getDate() != 1; }], // not the first of the month + ["%b %-d", function (d) { return d.getMonth(); }], // not Jan 1st + ["%Y", function () { return true; }] + ]); + chart.xAxis + .showMaxMin(false) + .tickPadding(10) + .tickFormat(function (d) { return tickMultiFormat(new Date(d)); }) + ; + + chart.yAxis + .showMaxMin(false) + .tickFormat(d3.format(",.0f")) + ; + + var svgElem = d3.select(location); + svgElem + .datum(data) + .transition() + .call(chart); + + // make our own x-axis tick marks because NVD3 doesn't provide any + var tickY2 = chart.yAxis.scale().range()[1]; + var lineElems = svgElem + .select('.nv-x.nv-axis.nvd3-svg') + .select('.nvd3.nv-wrap.nv-axis') + .select('g') + .selectAll('.tick') + .data(chart.xScale().ticks()) + .append('line') + .attr('class', 'x-axis-tick-mark') + .attr('x2', 0) + .attr('y1', tickY2 + 4) + .attr('y2', tickY2) + .attr('stroke-width', 1) + ; + + // set up the tooltip to display full dates + var tsFormat = d3.time.format('%b %-d, %Y %I:%M%p'); + var contentGenerator = chart.interactiveLayer.tooltip.contentGenerator(); + var tooltip = chart.interactiveLayer.tooltip; + tooltip.contentGenerator(function (d) { d.value = d.series[0].data.x; return contentGenerator(d); }); + tooltip.headerFormatter(function (d) { return tsFormat(new Date(d)); }); + + // common stuff for the sections below + var xScale = chart.xScale(); + var xPixelFirstBar = xScale(data[0].values[0].x); + var xPixelSecondBar = xScale(data[0].values[0].x + barTimespan * 1000); + var barWidth = xPixelSecondBar - xPixelFirstBar; // number of pixels representing time delta per bar + + // fix the bar widths so they don't overlap when there are gaps + function fixBarWidths(barSpacingFraction) { + svgElem + .selectAll('.nv-bars') + .selectAll('rect') + .attr('width', (1 - barSpacingFraction) * barWidth) + .attr('transform', function (d, i) { + var deltaX = xScale(data[0].values[i].x) - xPixelFirstBar; + deltaX += barSpacingFraction / 2 * barWidth; + return 'translate(' + deltaX + ', 0)'; + }) + ; + } + + /* + If you're representing sample measurements spaced a certain time apart, the tick marks should + be in the middle of the bars and some spacing between bars is recommended to aid with interpretation. + On the other hand, if you want to represent a quantity measured over a span of time (one bar), you're + better off placing the ticks on the edge of the bar and leaving no gap in between bars. + */ + function shiftXAxis() { + var xAxisElem = svgElem.select('.nv-axis.nv-x'); + var transform = xAxisElem.attr('transform'); + var xShift = -barWidth / 2; + transform = transform.replace('0,', xShift + ','); + xAxisElem.attr('transform', transform); + } + + if (meaning === 'instant') { + fixBarWidths(0.2); + } + else if (meaning === 'timespan') { + fixBarWidths(0.0); + shiftXAxis(); + } + + return chart; + }); + } + + renderChart('#test1', 'instant'); + renderChart('#test2', 'timespan'); + + window.setTimeout(function () { + window.setTimeout(function () { + document.getElementById('sc-one').style.display = 'block'; + document.getElementById('sc-two').style.display = 'none'; + }, 0); + }, 0); + + function switchChartStyle(style) { + if (style === 'instant') { + document.getElementById('sc-one').style.display = 'block'; + document.getElementById('sc-two').style.display = 'none'; + } + else if (style === 'timespan') { + document.getElementById('sc-one').style.display = 'none'; + document.getElementById('sc-two').style.display = 'block'; + } + } + +} \ No newline at end of file diff --git a/nvd3/nvd3.d.ts b/nvd3/nvd3.d.ts index 7e462248cc..19c03d6dcd 100644 --- a/nvd3/nvd3.d.ts +++ b/nvd3/nvd3.d.ts @@ -5,7 +5,8 @@ /// declare module nv { -//#region Chart Component + +//#region Core Interfaces interface Margin { left?: number, right?: number, @@ -18,6 +19,11 @@ declare module nv { width: number; } + interface ArcsRadius { + inner: number; + outer: number; + } + interface Offset { left?: number; top?: number; @@ -31,6 +37,34 @@ declare module nv { tooltip: Tooltip } + interface SymbolMap { + set(name:string,func: (size: any)=>void): void + } + + interface Utils { + /* Default color chooser uses a color scale of 20 colors from D3 https://github.com/mbostock/d3/wiki/Ordinal-Scales#categorical-colors */ + defaultColor(): string[]; + + getColor(arg: any): string[]; + + /* Binds callback function to run when window is resized */ + windowResize(listener: (ev: Event) => any): void; + /* Gets the browser window size */ + windowSize(): Size; + state(): State; + symbolMap: SymbolMap; + } + + interface ChartFactory { + generate: () => TChart; + callback?: (chart: TChart) => void; + } + + interface Nvd3TooltipStatic { + show([left, top]: [number, number], content: string, gravity?: string) //todo sort out use on nv.tooltip. + cleanup(): void; //todo sort out use on nv.tooltip. + } + interface Nvd3Element { dispatch: d3.Dispatch; options(options: any) @@ -42,12 +76,13 @@ declare module nv { } interface Chart extends Nvd3Element { - state: State; interactiveLayer: InteractiveLayer; - } - //#region Chart Component + +//#endregion + +//#region Chart Component interface Legend extends Nvd3Element { align(): boolean; @@ -91,9 +126,6 @@ declare module nv { width(value: number): this; } - /** - *NVD3 extension of D3 Axis - */ interface Nvd3Axis extends d3.svg.Axis { axisLabel(): string; axisLabel(value: string): this; @@ -148,78 +180,6 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; } - - interface Tooltip { - - /*For tooltip: Parent dom element of the SVG that holds the chart. This will make the tooltip dom be created inside this container instead of on the document body.*/ - chartContainer(el: HTMLElement): this - /*For tooltip: Parent dom element of the SVG that holds the chart. This will make the tooltip dom be created inside this container instead of on the document body.*/ - chartContainer(): HTMLElement - /*Attaches additional CSS classes to the tooltip DIV that is created.*/ - classes(el: string): this - /*Attaches additional CSS classes to the tooltip DIV that is created.*/ - classes(): string - /*Function that generates the tooltip content html.*/ - contentGenerator(): (d :any) => string; - /*Function that generates the tooltip content html.*/ - contentGenerator(func: (d: any) => string): this; - data(): any; - data(value: any): this; - distance(): number; - distance(value: number): this; - /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ - duration(): number; - /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ - duration(value: number): this; - /*For tooltip: completely enables or disabled the tooltip*/ - enabled(): boolean; - /*For tooltip: completely enables or disabled the tooltip*/ - enabled(value: boolean): this; - /*For tooltip: If not null, this fixes the top position of the tooltip.*/ - fixedTop(): number; - /*For tooltip: If not null, this fixes the top position of the tooltip.*/ - fixedTop(value: number): this; - /*Can be 'n','s','e','w'. Determines how tooltip is positioned*/ - gravity(): string; - /*Can be 'n','s','e','w'. Determines how tooltip is positioned*/ - gravity(value: string): this; - /*For tooltip: show the x axis value in the tooltip or not (not valid for pie charts for instance)*/ - headerEnabled(): boolean; - /*For tooltip: show the x axis value in the tooltip or not (not valid for pie charts for instance)*/ - headerEnabled(value: boolean): this; - /*For tooltip: formats the x axis value in the tooltip*/ - headerFormatter(func: (d: any) => string): this; - /*For tooltip: formats the x axis value in the tooltip*/ - headerFormatter(): (d: any) => string; - /*For tooltip: show or hide the tooltip by setting this to true or false. Tooltips used to be created and destroyed, but now we re-used the element and set opacity to 1 or 0.*/ - hidden(): boolean; - /*For tooltip: show or hide the tooltip by setting this to true or false. Tooltips used to be created and destroyed, but now we re-used the element and set opacity to 1 or 0.*/ - hidden(value: boolean): this; - /*Delay in ms before the tooltip hides itself after a mouseout event. A new mouseover event cancels the hide if within this timeout period.*/ - hideDelay(): number; - /*Delay in ms before the tooltip hides itself after a mouseout event. A new mouseover event cancels the hide if within this timeout period.*/ - hideDelay(value: number): this; - /**/ - id(): number; - keyFormatter(): (d: any, i: number) => string; - keyFormatter(func: (d: any, i: number) => string): this; - offset(): Offset; - offset(value: Offset): this; - /*sets the top/left positioning for the tooltip. Should be given an object with 'left' and/or 'top' attributes. You can override just one, just like the 'margin' option on charts*/ - position(): Offset; - /*sets the top/left positioning for the tooltip. Should be given an object with 'left' and/or 'top' attributes. You can override just one, just like the 'margin' option on charts*/ - position(value: Offset): this; - /*Tolerance allowed before tooltip is moved from its current position (creates 'snapping' effect)*/ - snapDistance(): number; - /*Tolerance allowed before tooltip is moved from its current position (creates 'snapping' effect)*/ - snapDistance(value: number): this; - /*returns the dom element of the tooltip.*/ - tooltipElem(): HTMLElement; - /*formats the y axis value(s) in the tooltip*/ - valueFormatter(): (d: any) => string; - /*formats the y axis value(s) in the tooltip*/ - valueFormatter(func: (d: any) => string): this; - } interface BoxPlot extends Nvd3Element { /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ @@ -234,8 +194,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; + id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -247,9 +207,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -339,8 +299,8 @@ declare module nv { height(value: number): this; high(): (d: any) => number; high(func: (d: any) => number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -360,9 +320,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -409,8 +369,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -430,9 +390,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -462,6 +422,32 @@ declare module nv { yScale(value: any): this; } + interface Distribution extends Nvd3Element { + axis(): string; + axis(value: 'x'): this; + axis(value: 'y'): this; + axis(value: string): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + domain(): number[]; + domain(value: number[]): this; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(): number; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(value: number): this; + getData(func: (d: any) => number): this; + scale(): any; + scale(value: any): this; + size(): number; + size(value: number): this; + width(): number; + width(value: number): this; + + + } + interface HistoricalBar extends Nvd3Element { /*If true, masks lines within the X and Y scales using a clip-path*/ clipEdge(): boolean; @@ -487,8 +473,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -506,9 +492,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -538,140 +524,12 @@ declare module nv { yScale(value: any): this; } - interface Scatter extends Nvd3Element { - /*If true, masks lines within the X and Y scales using a clip-path*/ - clipEdge(): boolean; - /*If true, masks lines within the X and Y scales using a clip-path*/ - clipEdge(value: boolean): this; - /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ - clipRadius(func: (d: any) => number): this; - /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ - clipRadius(value: number): this; - /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ - clipVoronoi(): boolean; - /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ - clipVoronoi(value: boolean): this; - /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ - color(value: string[]): this; - /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ - color(func: (d: any, i: number) => string): this; - /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ - duration(): number; - /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ - duration(value: number): this; - /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forcePoint(): number[]; - /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forcePoint(value: number[]): this; - /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceX(): number[]; - /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceX(value: number[]): this; - /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceY(): number[]; - /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceY(value: number[]): this; - /*The height the graph or component created inside the SVG should be made*/ - height(): number; - /*The height the graph or component created inside the SVG should be made.*/ - height(value: number): this; - id(): number; - id(value: number): this; - /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ - interactive(): boolean; - /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ - interactive(value: boolean): this; - /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ - margin(): Margin; - /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ - margin(value: Margin): this; - /**/ - padData(): boolean; - /**/ - padData(value: boolean): this; - /**/ - padDataOuter(): number; - /**/ - padDataOuter(value: number): this; - /* Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ - pointActive(): (d: any) => boolean; - /*Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ - pointActive(func: (d: any) => boolean): this; - /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ - pointxDomain(): number[]; - /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ - pointDomain(value: number[]): this; - /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - pointRange(): number[]; - /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - pointRange(value: number[]): this; - /* Override the default scale type for the point axis*/ - pointScale(): any; - /* Override the default scale type for the point axis*/ - pointScale(value: any): this; - /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ - pointSize(): (d: any) => number; - /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ - pointSize(func: (d: any) => number): this; - /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ - pointSize(value: number): this; - /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ - showVoronoi(): boolean; - /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ - showVoronoi(value: boolean): this; - /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ - useVoronoi(): boolean; - /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ - useVoronoi(value: boolean): this; - /* The width the graph or component created inside the SVG should be made*/ - width(): number; - /*The width the graph or component created inside the SVG should be made.*/ - width(value: number): this; - /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; - /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; - /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ - xDomain(): number[]; - /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ - xDomain(value: number[]): this; - /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - xRange(): number[]; - /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - xRange(value: number[]): this; - /* Override the default scale type for the X axis*/ - xScale(): any; - /* Override the default scale type for the X axis*/ - xScale(value: any): this; - y(): (d: any) => number; - /* Proxy function to return the y value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - y(func: (d: any) => number): this; - /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ - yDomain(): number[]; - /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ - yDomain(value: number[]): this; - /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - yRange(): number[]; - /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - yRange(value: number[]): this; - /* Override the default scale type for the y axis*/ - yScale(): any; - /* Override the default scale type for the y axis*/ - yScale(value: any): this; - - } - interface Line extends Scatter { scatter: Scatter; - clearHighlights(): this; /*A provided function that allows a line to be non-continuous when not defined.*/ defined(): (d: any, i: number) => boolean; /*A provided function that allows a line to be non-continuous when not defined.*/ defined(func: (d: any, i: number) => boolean): this; - /**/ - highlightPoint(): (d: any) => boolean; - /**/ - highlightPoint(func: (d: any) => boolean): this; /*controls the line interpolation between points, many options exist, see the D3 reference:*/ interpolate(): string; /*controls the line interpolation between points, many options exist, see the D3 reference:*/ @@ -681,9 +539,7 @@ declare module nv { /*Function to define if a line is a normal line or if it fills in the area. Notice the default gets the value from the line's definition in data. If a non-function is given, it the value is used for all lines.*/ isArea(value: boolean): this; /*Function to define if a line is a normal line or if it fills in the area. Notice the default gets the value from the line's definition in data. If a non-function is given, it the value is used for all lines.*/ - isArea(func: (d: any) => boolean): this; - - + isArea(func: (d: any) => boolean): this; } interface MultiBar extends Nvd3Element { @@ -723,8 +579,8 @@ declare module nv { hideable(): boolean; /**/ hideable(value: boolean): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -750,9 +606,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -811,8 +667,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -850,9 +706,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -911,8 +767,8 @@ declare module nv { height(value: number): this; high(): (d: any) => number; high(func: (d: any) => number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -932,9 +788,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1000,6 +856,457 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; } + + interface Pie extends Nvd3Element { + /*Specifies each slice size, by an inner and a outer radius. Values between 0 and 1*/ + arcsRadius(): ArcsRadius[]; + /*Specifies each slice size, by an inner and a outer radius. Values between 0 and 1*/ + arcsRadius(value: ArcsRadius[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + /*D3 3.4+, For donut charts only, the corner radius of the slices. Typically used with padAngle.*/ + cornerRadius(): number; + /*D3 3.4+, For donut charts only, the corner radius of the slices. Typically used with padAngle.*/ + cornerRadius(value: number): this; + /*Whether to make a pie graph a donut graph or not.*/ + donut(): boolean; + /*Whether to make a pie graph a donut graph or not.*/ + donut(value: boolean): this; + /**/ + donutLabelsOutside(): boolean; + /**/ + donutLabelsOutside(value: boolean): this; + /*Percent of pie radius to cut out of the middle to make the donut. It is multiplied by the outer radius to calculate the inner radius, thus it should be between 0 and 1.*/ + donutRatio(): number; + /*Percent of pie radius to cut out of the middle to make the donut. It is multiplied by the outer radius to calculate the inner radius, thus it should be between 0 and 1.*/ + donutRatio(value: number): this; + /*Function used to manage the ending angle of the pie/donut chart*/ + endAngle(): (d: any) => number; + /*Function used to manage the ending angle of the pie/donut chart*/ + endAngle(func: (d: any) => number): this; + /*For pie/donut charts, whether to increase slice radius on hover or not*/ + growOnHover(): boolean; + /*For pie/donut charts, whether to increase slice radius on hover or not*/ + growOnHover(value: boolean): this; + /*The height the graph or component created inside the SVG should be made*/ + height(): number; + /*The height the graph or component created inside the SVG should be made.*/ + height(value: number): this; + id(): any; +id(value: number|string): this; + /**/ + labelFormat(): string; + /**/ + labelFormat(value: string): this; + /**/ + labelFormat(format: (d: any) => string): this; + /**/ + labelSunbeamLayout(): boolean; + /**/ + labelSunbeamLayout(value: boolean): this; + /*Pie/donut charts: The slice threshold size to not display the label because it woudl be too small of a space*/ + labelThreshold(): number; + /*Pie/donut charts: The slice threshold size to not display the label because it woudl be too small of a space*/ + labelThreshold(value: number): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(): string; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: 'key'): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: 'value'): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: 'percent'): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: string): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(func: (d: any, i: number, values:any)=> string): this; + /*Whether pie/donut chart labels should be outside the slices instead of inside them*/ + labelsOutside(): boolean; + /*Whether pie/donut chart labels should be outside the slices instead of inside them*/ + labelsOutside(value: boolean): this; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(): Margin; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(value: Margin): this; + /*D3 3.4+, For donut charts only, the percent of the chart that should be spacing between slices.*/ + padAngle(): number; + /*D3 3.4+, For donut charts only, the percent of the chart that should be spacing between slices.*/ + padAngle(value: number): this; + /**/ + pieLabelsOutside(): boolean; + /**/ + pieLabelsOutside(value: boolean): this; + /*Show pie/donut chart labels for each slice*/ + showLabels(): boolean; + /*Show pie/donut chart labels for each slice*/ + showLabels(value: boolean): this; + /*Function used to manage the starting angle of the pie/donut chart*/ + startAngle(): (d: any) => number; + /*Function used to manage the starting angle of the pie/donut chart*/ + startAngle(func: (d: any) => number): this; + /*Text to include within the middle of a donut chart*/ + title(): string; + /*Text to include within the middle of a donut chart*/ + title(value: string): this; + /*Vertical offset for the donut chart title*/ + titleOffset(): number; + /*Vertical offset for the donut chart title*/ + titleOffset(value: number): this; + /*D3 Format object for the label of pie/donut, discrete bar and multibar charts.*/ + valueFormat(): string; + /*D3 Format object for the label of pie/donut, discrete bar and multibar charts.*/ + valueFormat(value: string): this; + /*D3 Format object for the label of pie/donut, discrete bar and multibar charts.*/ + valueFormat(format: (d: any) => string): this; + /* The width the graph or component created inside the SVG should be made*/ + width(): number; + /*The width the graph or component created inside the SVG should be made.*/ + width(value: number): this; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(): (d: any) => any; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(func: (d: any) => any): this; + /*Proxy function to return the Y value so adjustments can be made if needed.For pie/ donut chart this returns the value for the slice.*/ + y(): (d: any) => number; + /*Proxy function to return the Y value so adjustments can be made if needed. For pie/donut chart this returns the value for the slice.*/ + y(func: (d: any) => number): this; + /**/ + } + + interface Scatter extends Nvd3Element { + clearHighlights(): this; + /*If true, masks lines within the X and Y scales using a clip-path*/ + clipEdge(): boolean; + /*If true, masks lines within the X and Y scales using a clip-path*/ + clipEdge(value: boolean): this; + /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ + clipRadius(func: (d: any) => number): this; + /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ + clipRadius(value: number): this; + /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ + clipVoronoi(): boolean; + /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ + clipVoronoi(value: boolean): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(): number; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(value: number): this; + /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forcePoint(): number[]; + /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forcePoint(value: number[]): this; + /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceX(): number[]; + /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceX(value: number[]): this; + /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceY(): number[]; + /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceY(value: number[]): this; + /*The height the graph or component created inside the SVG should be made*/ + height(): number; + /*The height the graph or component created inside the SVG should be made.*/ + height(value: number): this; + id(): any; + id(value: number | string): this; + /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ + interactive(): boolean; + /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ + interactive(value: boolean): this; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(): Margin; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(value: Margin): this; + /**/ + padData(): boolean; + /**/ + padData(value: boolean): this; + /**/ + padDataOuter(): number; + /**/ + padDataOuter(value: number): this; + /* Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ + pointActive(): (d: any) => boolean; + /*Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ + pointActive(func: (d: any) => boolean): this; + /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ + pointxDomain(): number[]; + /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ + pointDomain(value: number[]): this; + /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + pointRange(): number[]; + /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + pointRange(value: number[]): this; + /* Override the default scale type for the point axis*/ + pointScale(): any; + /* Override the default scale type for the point axis*/ + pointScale(value: any): this; + /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ + pointSize(): (d: any) => number; + /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ + pointSize(func: (d: any) => number): this; + /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ + pointSize(value: number): this; + /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ + showVoronoi(): boolean; + /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ + showVoronoi(value: boolean): this; + /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ + useVoronoi(): boolean; + /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ + useVoronoi(value: boolean): this; + /* The width the graph or component created inside the SVG should be made*/ + width(): number; + /*The width the graph or component created inside the SVG should be made.*/ + width(value: number): this; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(): (d: any) => any; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(func: (d: any) => any): this; + /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ + xDomain(): number[]; + /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ + xDomain(value: number[]): this; + /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + xRange(): number[]; + /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + xRange(value: number[]): this; + /* Override the default scale type for the X axis*/ + xScale(): any; + /* Override the default scale type for the X axis*/ + xScale(value: any): this; + y(): (d: any) => number; + /* Proxy function to return the y value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + y(func: (d: any) => number): this; + /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ + yDomain(): number[]; + /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ + yDomain(value: number[]): this; + /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + yRange(): number[]; + /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + yRange(value: number[]): this; + /* Override the default scale type for the y axis*/ + yScale(): any; + /* Override the default scale type for the y axis*/ + yScale(value: any): this; + + } + + interface SparkLine extends Nvd3Element { + animate(): boolean; + animate(value: boolean): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + /*The height the graph or component created inside the SVG should be made*/ + height(): number; + /*The height the graph or component created inside the SVG should be made.*/ + height(value: number): this; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(): Margin; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(value: Margin): this; + /* The width the graph or component created inside the SVG should be made*/ + width(): number; + /*The width the graph or component created inside the SVG should be made.*/ + width(value: number): this; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(): (d: any, i?: number) => number; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(func: (d: any, i?: number) => number): this; + /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ + xDomain(): number[]; + /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ + xDomain(value: number[]): this; + /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + xRange(): number[]; + /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + xRange(value: number[]): this; + /* Override the default scale type for the X axis*/ + xScale(): any; + /* Override the default scale type for the X axis*/ + xScale(value: any): this; + y(): (d: any, i?: number) => number; + /* Proxy function to return the y value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + y(func: (d: any, i?: number) => number): this; + /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ + yDomain(): number[]; + /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ + yDomain(value: number[]): this; + /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + yRange(): number[]; + /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + yRange(value: number[]): this; + /* Override the default scale type for the y axis*/ + yScale(): any; + /* Override the default scale type for the y axis*/ + yScale(value: any): this; + } + + interface SparkLinePlus extends SparkLine { + sparkline: SparkLine; + + alignValue(): boolean; + alignValue(value: boolean): this; + /*Message to display if no data is provided*/ + noData(): string; + /*Message to display if no data is provided*/ + noData(value: string): this; + rightAlignValue(): boolean; + rightAlignValue(value: boolean): this; + /*Shows the last value in the sparkline to the right of the line.*/ + showLastValue(): boolean; + /*Shows the last value in the sparkline to the right of the line.*/ + showLastValue(value: boolean): this; + xTickFormat(format: (d: any) => string): this; + xTickFormat(format: string): this; + xTickFormat(format: (d: any, i: any) => string); + yTickFormat(format: (d: any) => string): this; + yTickFormat(format: string): this; + yTickFormat(format: (d: any, i: any) => string); + } + + interface StackedArea extends Scatter { + scatter: Scatter; + /*A provided function that allows a line to be non-continuous when not defined.*/ + defined(): (d: any, i: number) => boolean; + /*A provided function that allows a line to be non-continuous when not defined.*/ + defined(func: (d: any, i: number) => boolean): this; + /*controls the line interpolation between points, many options exist, see the D3 reference:*/ + interpolate(): string; + /*controls the line interpolation between points, many options exist, see the D3 reference:*/ + interpolate(value: string): this; + /* options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function*/ + offset(offset: 'silhouette'): this; + /* options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function*/ + offset(offset: 'wiggle'): this; + /* options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function*/ + offset(offset: 'expand'): this; + /* options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function*/ + offset(offset: 'zero'): this; + /* options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function*/ + offset(offset: string): this; + /* options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function*/ + offset(offset: (data: Array<[number, number]>) => number[]): this; + order(): string; + order(value: string): this; + style(offset: 'stack'): this; + style(offset: 'stream'): this; + style(offset: 'stream-center'): this; + style(offset: 'expand'): this; + style(offset: 'stack_percent'): this; + style(offset: string): this; + } + + interface Sunburst extends Nvd3Element { + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + /*The height the graph or component created inside the SVG should be made*/ + height(): number; + /*The height the graph or component created inside the SVG should be made.*/ + height(value: number): this; + id(): any; + id(value: number|string): this; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(): Margin; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(value: Margin): this; + /*For sunburst only: specifies the mode of drawing the sunburst segments. Can be 'size' or 'count'. 'size' draws the segments according to the 'size' attribute of the leaf nodes, 'count' draws according to the amount of siblings a node has.*/ + mode(): string; + /*For sunburst only: specifies the mode of drawing the sunburst segments. Can be 'size' or 'count'. 'size' draws the segments according to the 'size' attribute of the leaf nodes, 'count' draws according to the amount of siblings a node has.*/ + mode(value: 'size'): this; + /*For sunburst only: specifies the mode of drawing the sunburst segments. Can be 'size' or 'count'. 'size' draws the segments according to the 'size' attribute of the leaf nodes, 'count' draws according to the amount of siblings a node has.*/ + mode(value: 'count'): this; + /*For sunburst only: specifies the mode of drawing the sunburst segments. Can be 'size' or 'count'. 'size' draws the segments according to the 'size' attribute of the leaf nodes, 'count' draws according to the amount of siblings a node has.*/ + mode(value: string): this; + /* The width the graph or component created inside the SVG should be made*/ + width(): number; + /*The width the graph or component created inside the SVG should be made.*/ + width(value: number): this; + } + + interface Tooltip { + + /*For tooltip: Parent dom element of the SVG that holds the chart. This will make the tooltip dom be created inside this container instead of on the document body.*/ + chartContainer(el: HTMLElement): this + /*For tooltip: Parent dom element of the SVG that holds the chart. This will make the tooltip dom be created inside this container instead of on the document body.*/ + chartContainer(): HTMLElement + /*Attaches additional CSS classes to the tooltip DIV that is created.*/ + classes(el: string): this + /*Attaches additional CSS classes to the tooltip DIV that is created.*/ + classes(): string + /*Function that generates the tooltip content html.*/ + contentGenerator(): (d: any) => string; + /*Function that generates the tooltip content html.*/ + contentGenerator(func: (d: any) => string): this; + data(): any; + data(value: any): this; + distance(): number; + distance(value: number): this; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(): number; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(value: number): this; + /*For tooltip: completely enables or disabled the tooltip*/ + enabled(): boolean; + /*For tooltip: completely enables or disabled the tooltip*/ + enabled(value: boolean): this; + /*For tooltip: If not null, this fixes the top position of the tooltip.*/ + fixedTop(): number; + /*For tooltip: If not null, this fixes the top position of the tooltip.*/ + fixedTop(value: number): this; + /*Can be 'n','s','e','w'. Determines how tooltip is positioned*/ + gravity(): string; + /*Can be 'n','s','e','w'. Determines how tooltip is positioned*/ + gravity(value: string): this; + /*For tooltip: show the x axis value in the tooltip or not (not valid for pie charts for instance)*/ + headerEnabled(): boolean; + /*For tooltip: show the x axis value in the tooltip or not (not valid for pie charts for instance)*/ + headerEnabled(value: boolean): this; + /*For tooltip: formats the x axis value in the tooltip*/ + headerFormatter(func: (d: any) => string): this; + /*For tooltip: formats the x axis value in the tooltip*/ + headerFormatter(): (d: any) => string; + /*For tooltip: show or hide the tooltip by setting this to true or false. Tooltips used to be created and destroyed, but now we re-used the element and set opacity to 1 or 0.*/ + hidden(): boolean; + /*For tooltip: show or hide the tooltip by setting this to true or false. Tooltips used to be created and destroyed, but now we re-used the element and set opacity to 1 or 0.*/ + hidden(value: boolean): this; + /*Delay in ms before the tooltip hides itself after a mouseout event. A new mouseover event cancels the hide if within this timeout period.*/ + hideDelay(): number; + /*Delay in ms before the tooltip hides itself after a mouseout event. A new mouseover event cancels the hide if within this timeout period.*/ + hideDelay(value: number): this; + /**/ + id(): any; + keyFormatter(): (d: any, i: number) => string; + keyFormatter(func: (d: any, i: number) => string): this; + offset(): Offset; + offset(value: Offset): this; + /*sets the top/left positioning for the tooltip. Should be given an object with 'left' and/or 'top' attributes. You can override just one, just like the 'margin' option on charts*/ + position(): Offset; + /*sets the top/left positioning for the tooltip. Should be given an object with 'left' and/or 'top' attributes. You can override just one, just like the 'margin' option on charts*/ + position(value: Offset): this; + /*Tolerance allowed before tooltip is moved from its current position (creates 'snapping' effect)*/ + snapDistance(): number; + /*Tolerance allowed before tooltip is moved from its current position (creates 'snapping' effect)*/ + snapDistance(value: number): this; + /*returns the dom element of the tooltip.*/ + tooltipElem(): HTMLElement; + /*formats the y axis value(s) in the tooltip*/ + valueFormatter(): (d: any) => string; + /*formats the y axis value(s) in the tooltip*/ + valueFormatter(func: (d: any) => string): this; + } + //#endregion //#region Charts @@ -1021,8 +1328,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; + id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -1060,9 +1367,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1182,8 +1489,8 @@ declare module nv { height(value: number): this; high(): (d: any) => number; high(func: (d: any) => number): this; - id(): number; - id(value: number): this; + id(): any; + id(value: number|string): this; this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -1233,9 +1540,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1295,8 +1602,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; + id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -1342,9 +1649,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1408,8 +1715,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -1456,9 +1763,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1493,6 +1800,7 @@ declare module nv { xAxis: Nvd3Axis; yAxis: Nvd3Axis; legend: Legend; + tooltip: Tooltip; clearHighlights(): this; /*If true, masks lines within the X and Y scales using a clip-path*/ @@ -1543,8 +1851,8 @@ declare module nv { highlightPoint(): (d: any) => boolean; /**/ highlightPoint(func: (d: any) => boolean): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -1636,9 +1944,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1741,8 +2049,8 @@ declare module nv { highlightPoint(): (d: any) => boolean; /**/ highlightPoint(func: (d: any) => boolean): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -1830,9 +2138,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -1927,8 +2235,8 @@ declare module nv { highlightPoint(): (d: any) => boolean; /**/ highlightPoint(func: (d: any) => boolean): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -2007,9 +2315,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -2099,8 +2407,8 @@ declare module nv { hideable(): boolean; /**/ hideable(value: boolean): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -2166,9 +2474,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -2243,8 +2551,8 @@ declare module nv { height(): number; /*The height the graph or component created inside the SVG should be made.*/ height(value: number): this; - id(): number; - id(value: number): this; + id(): any; +id(value: number|string): this; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ @@ -2295,9 +2603,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -2331,84 +2639,25 @@ declare module nv { yScale(value: any): this; } - //todo complete + interface MultiChart extends Chart { lines1: Line; lines2: Line; - bars1: HistoricalBar; - bars2: HistoricalBar; - stack1: HistoricalBar; - stack2: HistoricalBar; + bars1: MultiBar; + bars2: MultiBar; + scatters1: Scatter; + scatters2: Scatter; + stack1: StackedArea; + stack2: StackedArea; xAxis: Nvd3Axis; yAxis1: Nvd3Axis; yAxis2: Nvd3Axis; tooltip: Tooltip; - brushExtent(): [number, number] | [[number, number], [number, number]]; - brushExtent(value: [number, number] | [[number, number], [number, number]]): this; - clearHighlights(): this; - /*If true, masks lines within the X and Y scales using a clip-path*/ - clipEdge(): boolean; - /*If true, masks lines within the X and Y scales using a clip-path*/ - clipEdge(value: boolean): this; - /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ - clipRadius(func: (d: any) => number): this; - /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ - clipRadius(value: number): this; - /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ - clipVoronoi(): boolean; - /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ - clipVoronoi(value: boolean): this; /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ color(value: string[]): this; /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ color(func: (d: any, i: number) => string): this; - /*No longer used.Use chart.dispatch.changeState(...) instead*/ - defaultState(): any; - /*No longer used.Use chart.dispatch.changeState(...) instead*/ - defaultState(value: any): this; - /*A provided function that allows a line to be non-continuous when not defined.*/ - defined(): (d: any, i: number) => boolean; - /*A provided function that allows a line to be non-continuous when not defined.*/ - defined(func: (d: any, i: number) => boolean): this; - /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ - duration(): number; - /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ - duration(value: number): this; - focusEnable(): boolean; - focusEnable(value: boolean): this; - focusHeight(): number; - focusHeight(value: number): this; - focusShowAxisX(): boolean; - focusShowAxisX(value: boolean): this; - focusShowAxisY(): boolean; - focusShowAxisY(value: boolean): this; - /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forcePoint(): number[]; - /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forcePoint(value: number[]): this; - /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceX(): number[]; - /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceX(value: number[]): this; - /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceY(): number[]; - /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ - forceY(value: number[]): this; - /*The height the graph or component created inside the SVG should be made*/ - height(): number; - /*The height the graph or component created inside the SVG should be made.*/ - height(value: number): this; - /**/ - highlightPoint(): (d: any) => boolean; - /**/ - highlightPoint(func: (d: any) => boolean): this; - id(): number; - id(value: number): this; - /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ - interactive(): boolean; - /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ - interactive(value: boolean): this; /*controls the line interpolation between points, many options exist, see the D3 reference:*/ interpolate(): string; /*controls the line interpolation between points, many options exist, see the D3 reference:*/ @@ -2419,58 +2668,16 @@ declare module nv { isArea(value: boolean): this; /*Function to define if a line is a normal line or if it fills in the area. Notice the default gets the value from the line's definition in data. If a non-function is given, it the value is used for all lines.*/ isArea(func: (d: any) => boolean): this; - /*The extra text after the label in the legend that tells what axis the series belongs to, for any series on the left axis.*/ - legendLeftAxisHint(): string; - /*The extra text after the label in the legend that tells what axis the series belongs to, for any series on the left axis.*/ - legendLeftAxisHint(value: string): this - /*The extra text after the label in the legend that tells what axis the series belongs to, for any seris on the right axis.*/ - legendRightAxisHint(): string; - /*The extra text after the label in the legend that tells what axis the series belongs to, for any seris on the right axis.*/ - legendRightAxisHint(value: string): this /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(): Margin; /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ margin(value: Margin): this; noData(): string; noData(value: string): this; - /**/ - padData(): boolean; - /**/ - padData(value: boolean): this; - /**/ - padDataOuter(): number; - /**/ - padDataOuter(value: number): this; - /* Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ - pointActive(): (d: any) => boolean; - /*Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ - pointActive(func: (d: any) => boolean): this; - /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ - pointxDomain(): number[]; - /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ - pointDomain(value: number[]): this; - /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - pointRange(): number[]; - /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - pointRange(value: number[]): this; - /* Override the default scale type for the point axis*/ - pointScale(): any; - /* Override the default scale type for the point axis*/ - pointScale(value: any): this; - /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ - pointSize(): (d: any) => number; - /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ - pointSize(func: (d: any) => number): this; - /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ - pointSize(value: number): this; /*Whether to display the legend or not.*/ showLegend(): boolean; /*Whether to display the legend or not.*/ showLegend(value: boolean): this; - /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ - showVoronoi(): boolean; - /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ - showVoronoi(value: boolean): this; /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ tooltipContent(): (d: any) => string; /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ @@ -2479,10 +2686,6 @@ declare module nv { tooltips(): boolean; /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ tooltips(value: boolean): this; - /*Sets the chart to use a guideline and floating tooltip instead of requiring the user to hover over specific hotspots. Turning this on will set the 'interactive' and 'useVoronoi' options to false to avoid conflicting.*/ - useInteractiveGuideline(): boolean; - /*Sets the chart to use a guideline and floating tooltip instead of requiring the user to hover over specific hotspots. Turning this on will set the 'interactive' and 'useVoronoi' options to false to avoid conflicting.*/ - useInteractiveGuideline(value: boolean): this; /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ useVoronoi(): boolean; /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ @@ -2492,36 +2695,21 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ - xDomain(): number[]; - /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ - xDomain(value: number[]): this; - /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - xRange(): number[]; - /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - xRange(value: number[]): this; - /* Override the default scale type for the X axis*/ - xScale(): any; - /* Override the default scale type for the X axis*/ - xScale(value: any): this; y(): (d: any) => number; /* Proxy function to return the y value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ y(func: (d: any) => number): this; - /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ - yDomain(): number[]; - /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ - yDomain(value: number[]): this; - /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - yRange(): number[]; - /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ - yRange(value: number[]): this; - /* Override the default scale type for the y axis*/ - yScale(): any; - /* Override the default scale type for the y axis*/ - yScale(value: any): this; + /* */ + yDomain1(): number[]; + /* */ + yDomain1(value: number[]): this; + /* */ + yDomain2(): number[]; + /* */ + yDomain2(value: number[]): this; } interface OhlcBarChart extends Chart { @@ -2563,8 +2751,8 @@ declare module nv { height(value: number): this; high(): (d: any) => number; high(func: (d: any) => number): this; - id(): number; - id(value: number): this; + id(): any; + id(value: number|string): this; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ interactive(): boolean; /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ @@ -2614,9 +2802,9 @@ declare module nv { /*The width the graph or component created inside the SVG should be made.*/ width(value: number): this; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(): (d: any) => number; + x(): (d: any) => any; /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ - x(func: (d: any) => number): this; + x(func: (d: any) => any): this; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ xDomain(): number[]; /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ @@ -2702,8 +2890,406 @@ declare module nv { width(value: number): this; } -//#endregion - + interface PieChart extends Chart { + legend: Legend; + pie: Pie; + tooltip: Tooltip; + + /*Specifies each slice size, by an inner and a outer radius. Values between 0 and 1*/ + arcsRadius(): ArcsRadius[]; + /*Specifies each slice size, by an inner and a outer radius. Values between 0 and 1*/ + arcsRadius(value: ArcsRadius[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + /*D3 3.4+, For donut charts only, the corner radius of the slices. Typically used with padAngle.*/ + cornerRadius(): number; + /*D3 3.4+, For donut charts only, the corner radius of the slices. Typically used with padAngle.*/ + cornerRadius(value: number): this; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(): any; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(value: any): this; + /*Whether to make a pie graph a donut graph or not.*/ + donut(): boolean; + /*Whether to make a pie graph a donut graph or not.*/ + donut(value: boolean): this; + /**/ + donutLabelsOutside(): boolean; + /**/ + donutLabelsOutside(value: boolean): this; + /*Percent of pie radius to cut out of the middle to make the donut. It is multiplied by the outer radius to calculate the inner radius, thus it should be between 0 and 1.*/ + donutRatio(): number; + /*Percent of pie radius to cut out of the middle to make the donut. It is multiplied by the outer radius to calculate the inner radius, thus it should be between 0 and 1.*/ + donutRatio(value: number): this; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(): number; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(value: number): this; + /*Function used to manage the ending angle of the pie/donut chart*/ + endAngle(): (d: any) => number; + /*Function used to manage the ending angle of the pie/donut chart*/ + endAngle(func: (d: any) => number): this; + /*For pie/donut charts, whether to increase slice radius on hover or not*/ + growOnHover(): boolean; + /*For pie/donut charts, whether to increase slice radius on hover or not*/ + growOnHover(value: boolean): this; + /*The height the graph or component created inside the SVG should be made*/ + height(): number; + /*The height the graph or component created inside the SVG should be made.*/ + height(value: number): this; + id(): any; +id(value: number|string): this; + /**/ + labelFormat(): string; + /**/ + labelFormat(value: string): this; + /**/ + labelFormat(format: (d: any) => string): this; + /**/ + labelSunbeamLayout(): boolean; + /**/ + labelSunbeamLayout(value: boolean): this; + /*Pie/donut charts: The slice threshold size to not display the label because it woudl be too small of a space*/ + labelThreshold(): number; + /*Pie/donut charts: The slice threshold size to not display the label because it woudl be too small of a space*/ + labelThreshold(value: number): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(): string; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: 'key'): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: 'value'): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: 'percent'): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(value: string): this; + /*pie/donut charts only: what kind of data to display for the slice labels. Options are key, value, or percent. */ + labelType(func: (d: any, i: number, values: any) => string): this; + /*Whether pie/donut chart labels should be outside the slices instead of inside them*/ + labelsOutside(): boolean; + /*Whether pie/donut chart labels should be outside the slices instead of inside them*/ + labelsOutside(value: boolean): this; + /*Position of the legend (top or right). */ + legendPosition(): string; + /*Position of the legend (top or right). */ + legendPosition(value: 'top'): this; + /*Position of the legend (top or right). */ + legendPosition(value: 'right'): this; + /*Position of the legend (top or right). */ + legendPosition(value: string): this; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(): Margin; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(value: Margin): this; + /*Message to display if no data is provided*/ + noData(): string; + /*Message to display if no data is provided*/ + noData(value : string): this; + /*D3 3.4+, For donut charts only, the percent of the chart that should be spacing between slices.*/ + padAngle(): number; + /*D3 3.4+, For donut charts only, the percent of the chart that should be spacing between slices.*/ + padAngle(value: number): this; + /**/ + pieLabelsOutside(): boolean; + /**/ + pieLabelsOutside(value: boolean): this; + /*Show pie/donut chart labels for each slice*/ + showLabels(): boolean; + /*Show pie/donut chart labels for each slice*/ + showLabels(value: boolean): this; + /*Whether to display the legend or not*/ + showLegend(): boolean; + /*Whether to display the legend or not*/ + showLegend(value: boolean): this; + /*Function used to manage the starting angle of the pie/donut chart*/ + startAngle(): (d: any) => number; + /*Function used to manage the starting angle of the pie/donut chart*/ + startAngle(func: (d: any) => number): this; + /*Text to include within the middle of a donut chart*/ + title(): string; + /*Text to include within the middle of a donut chart*/ + title(value: string): this; + /*Vertical offset for the donut chart title*/ + titleOffset(): number; + /*Vertical offset for the donut chart title*/ + titleOffset(value: number): this; + /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ + tooltipContent(): (d: any) => string; + /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ + tooltipContent(func: (d: any) => string): this; + /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ + tooltips(): boolean; + /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ + tooltips(value: boolean): this; + /*D3 Format object for the label of pie/donut, discrete bar and multibar charts.*/ + valueFormat(): string; + /*D3 Format object for the label of pie/donut, discrete bar and multibar charts.*/ + valueFormat(value: string): this; + /*D3 Format object for the label of pie/donut, discrete bar and multibar charts.*/ + valueFormat(format: (d: any) => string): this; + /* The width the graph or component created inside the SVG should be made*/ + width(): number; + /*The width the graph or component created inside the SVG should be made.*/ + width(value: number): this; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(): (d: any) => any; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(func: (d: any) => any): this; + /*Proxy function to return the Y value so adjustments can be made if needed.For pie/ donut chart this returns the value for the slice.*/ + y(): (d: any) => number; + /*Proxy function to return the Y value so adjustments can be made if needed. For pie/donut chart this returns the value for the slice.*/ + y(func: (d: any) => number): this; + } + + interface ScatterChart extends Chart { + scatter: Scatter; + xAxis: Nvd3Axis; + yAxis: Nvd3Axis; + legend: Legend; + tooltip: Tooltip; + distX: Distribution; + distY: Distribution; + + clearHighlights(): this; + /*If true, masks lines within the X and Y scales using a clip-path*/ + clipEdge(): boolean; + /*If true, masks lines within the X and Y scales using a clip-path*/ + clipEdge(value: boolean): this; + /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ + clipRadius(func: (d: any) => number): this; + /*When useVoronoi and clipVoronoi are true, you can control the clip radius with this option. Essentially this lets you set how far away from the actual point you can put the mouse for it to select the point.*/ + clipRadius(value: number): this; + /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ + clipVoronoi(): boolean; + /*When useVoronoi is on, this masks each voronoi section with a circle to limit selection to smaller area.*/ + clipVoronoi(value: boolean): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(value: string[]): this; + /*Colors to use for the different data. If an array is given, it is converted to a function automatically.*/ + color(func: (d: any, i: number) => string): this; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(): any; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(value: any): this; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(): number; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(value: number): this; + /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forcePoint(): number[]; + /*List of numbers to Force into the point scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forcePoint(value: number[]): this; + /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceX(): number[]; + /*List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceX(value: number[]): this; + /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceY(): number[]; + /*List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). This ensures the numbers are in the X domain but doesn't override the whole domain. This option only applies if you have not overridden the whole domain with the xDomain option*/ + forceY(value: number[]): this; + /*The height the graph or component created inside the SVG should be made*/ + height(): number; + /*The height the graph or component created inside the SVG should be made.*/ + height(value: number): this; + /**/ + highlightPoint(): (d: any) => boolean; + /**/ + highlightPoint(func: (d: any) => boolean): this; + id(): any; +id(value: number|string): this; + /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ + interactive(): boolean; + /*A master flag for turning chart interaction on and off. This overrides all tooltip, voronoi, and guideline options.*/ + interactive(value: boolean): this; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(): Margin; + /*Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.*/ + margin(value: Margin): this; + noData(): string; + noData(value: string): this; + /**/ + padData(): boolean; + /**/ + padData(value: boolean): this; + /**/ + padDataOuter(): number; + /**/ + padDataOuter(value: number): this; + /* Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ + pointActive(): (d: any) => boolean; + /*Function used to determine if scatter points are active or not, returns false to denote them as inactive and true for active.*/ + pointActive(func: (d: any) => boolean): this; + /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ + pointxDomain(): number[]; + /* Defines the whole point scale's domain. Using this will disable calculating the domain based on the data.*/ + pointDomain(value: number[]): this; + /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + pointRange(): number[]; + /* Override the point scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + pointRange(value: number[]): this; + /* Override the default scale type for the point axis*/ + pointScale(): any; + /* Override the default scale type for the point axis*/ + pointScale(value: any): this; + /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ + pointSize(): (d: any) => number; + /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ + pointSize(func: (d: any) => number): this; + /* Specifies the size of the points in a scatter. Scatter is also used to make the hover points on lines.*/ + pointSize(value: number): this; + /*When only one Y axis is used, this puts the Y axis on the right side instead of the left.*/ + rightAlignYAxis(): boolean; + /*When only one Y axis is used, this puts the Y axis on the right side instead of the left.*/ + rightAlignYAxis(value: boolean): this; + /**/ + showDistX(): boolean; + /**/ + showDistX(value: boolean): this; + /**/ + showDistY(): boolean; + /**/ + showDistY(value: boolean): this; + /*Whether to display the legend or not.*/ + showLegend(): boolean; + /*Whether to display the legend or not.*/ + showLegend(value: boolean): this; + /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ + showVoronoi(): boolean; + /*Displays the voronoi areas on the chart. This is mostly helpful when debugging issues.*/ + showVoronoi(value: boolean): this; + /*Display or hide the X axis*/ + showXAxis(): boolean; + /*Display or hide the X axis*/ + showXAxis(value: boolean): this; + /*Display or hide the Y axis*/ + showYAxis(): boolean; + /*Display or hide the Y axis*/ + showYAxis(value: boolean): this; + /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ + tooltipContent(): (d: any) => string; + /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ + tooltipContent(func: (d: any) => string): this; + /**/ + tooltipXContent(): (d: any) => string; + /**/ + tooltipXContent(func: (d: any) => string): this; + /**/ + tooltipYContent(): (d: any) => string; + /**/ + tooltipYContent(func: (d: any) => string): this; + /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ + tooltips(): boolean; + /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ + tooltips(value: boolean): this; + /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ + useVoronoi(): boolean; + /*Use voronoi diagram to select nearest point to display tooltip instead of requiring a hover over the specific point itself. Setting this to false will also set clipVoronoi to false.*/ + useVoronoi(value: boolean): this; + /* The width the graph or component created inside the SVG should be made*/ + width(): number; + /*The width the graph or component created inside the SVG should be made.*/ + width(value: number): this; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(): (d: any) => any; + /* Proxy function to return the X value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + x(func: (d: any) => any): this; + /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ + xDomain(): number[]; + /* Defines the whole X scale's domain. Using this will disable calculating the domain based on the data.*/ + xDomain(value: number[]): this; + /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + xRange(): number[]; + /* Override the X scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + xRange(value: number[]): this; + /* Override the default scale type for the X axis*/ + xScale(): any; + /* Override the default scale type for the X axis*/ + xScale(value: any): this; + y(): (d: any) => number; + /* Proxy function to return the y value so adjustments can be made if needed. For pie/donut chart this returns the key for the slice.*/ + y(func: (d: any) => number): this; + /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ + yDomain(): number[]; + /* Defines the whole y scale's domain. Using this will disable calculating the domain based on the data.*/ + yDomain(value: number[]): this; + /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + yRange(): number[]; + /* Override the y scale's range. Using this will disable calculating the range based on the data and chart width/height.*/ + yRange(value: number[]): this; + /* Override the default scale type for the y axis*/ + yScale(): any; + /* Override the default scale type for the y axis*/ + yScale(value: any): this; + + } + + interface StackedAreaChart extends StackedArea, Chart { + stacked: StackedArea; + legend: Legend; + controls: Legend; + xAxis: Nvd3Axis; + yAxis: Nvd3Axis; + tooltip: Tooltip; + + controlLabels(): any; + /*Object that defines the labels for control items in the graph. For instance, in the stackedAreaChart, there are controls for making it stacked, expanded, or stream. For stacked bar charts, there is stacked and grouped.*/ + controlLabels(value: any): this; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(): any; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(value: any): this; + /*Message to display if no data is provided*/ + noData(): string; + /*Message to display if no data is provided*/ + noData(value: string): this; + rightAlignYAxis(): boolean; + /*When only one Y axis is used, this puts the Y axis on the right side instead of the left.*/ + rightAlignYAxis(value: boolean): this; + showLegend(): boolean; + /*Whether to display the legend or not*/ + showLegend(value: boolean): this; + /*Display or hide the X axis*/ + showXAxis(): boolean; + /*Display or hide the X axis*/ + showXAxis(value: boolean): this; + /*Display or hide the Y axis*/ + showYAxis(): boolean; + /*Display or hide the Y axis*/ + showYAxis(value: boolean): this; + /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ + tooltipContent(): (d: any) => string; + /*Deprecated. Use chart.tooltip.contentGenerator or chart.interactiveGuideline.tooltip.contentGenerator to control tooltip content.*/ + tooltipContent(func: (d: any) => string): this; + /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ + tooltips(): boolean; + /*Deprecated. Use chart.tooltip.enabled or chart.interactive to control if tooltips are enabled or not.*/ + tooltips(value: boolean): this; + /*Sets the chart to use a guideline and floating tooltip instead of requiring the user to hover over specific hotspots. Turning this on will set the 'interactive' and 'useVoronoi' options to false to avoid conflicting.*/ + useInteractiveGuideline(): boolean; + /*Sets the chart to use a guideline and floating tooltip instead of requiring the user to hover over specific hotspots. Turning this on will set the 'interactive' and 'useVoronoi' options to false to avoid conflicting.*/ + useInteractiveGuideline(value: boolean): this; + } + + interface SunburstChart extends Sunburst, Chart { + sunburst: Sunburst; + tooltip: Tooltip; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(): number; + /*Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.*/ + duration(value: number): this; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(): any; + /*No longer used.Use chart.dispatch.changeState(...) instead*/ + defaultState(value: any): this; + /*Message to display if no data is provided*/ + noData(): string; + /*Message to display if no data is provided*/ + noData(value: string): this; + } + +//#endregion interface Models{ boxPlotChart(): BoxPlotChart; @@ -2714,6 +3300,7 @@ declare module nv { cumulativeLineChart(): CumulativeLineChart; discreteBar(): DiscreteBar; discreteBarChart(): DiscreteBarChart; + distribution(): Distribution; historicalBar(): HistoricalBar; historicalBarChart(bar_model?: HistoricalBar): HistoricalBarChart; ohlcBar(): OhlcBar; @@ -2725,34 +3312,40 @@ declare module nv { lineWithFocusChart(): LineWithFocusChart; multiBarChart(): MultiBarChart; multiBarHorizontalChart(): MultiBarHorizontalChart; + multiChart(): MultiChart; parallelCoordinates(): ParallelCoordinates; parallelCoordinatesChart(): ParallelCoordinatesChart; + pie(): Pie; + pieChart(): PieChart; scatter(): Scatter; + scatterChart(): ScatterChart; + sparkline(): SparkLine; + sparklinePlus(): SparkLinePlus; + stackedArea(): StackedArea; + stackedAreaChart(): StackedAreaChart; + sunburst(): Sunburst; + sunburstChart(): SunburstChart; tooltip(): Tooltip; } - interface Utils { - windowResize(listener: (ev: Event) => any): void; - windowSize(): Size; - state(): State; - } - interface ChartFactory { - generate: () => TChart; - callback?: (chart: TChart)=> void; - } + interface Nvd3Static{ + /*set to false in production*/ + dev: boolean + /*stores all the ready to use charts*/ + charts: any + models: Models; + tooltip: Nvd3TooltipStatic; + utils: Utils; + + /*stores some statistics and potential error messages*/ + logs: any; - interface nvTooltipStatic { - show([left, top]: [number, number], content: string, gravity: string) //todo sort out use on nv.tooltip. - cleanup(): void; //todo sort out use on nv.tooltip. - } - - interface nvStatic{ - models: Models; - tooltip: nvTooltipStatic; - utils: Utils; addGraph(factory: ChartFactory); addGraph(generate: () => TChart, callBack?: (chart: TChart) => void); - log: (topic:string, value?:string)=> void + + + log(topic: string, value?: string): string //returns last argument + log(arg: any[]): any //returns last argument } } -declare var nv : nv.nvStatic; \ No newline at end of file +declare var nv : nv.Nvd3Static; \ No newline at end of file