nvd3.js

How I can custom a tooltipContent of tooltips using data loaded into "datum" in discreteBarChart nvd3.js?, for example, with the following data Jason, I want to see data3, data4, Data5 in tooltips JsonData = [ { key: "Serie1", values: [ {'Data1': 1, 'Data2': 2, 'Data3': 3, 'Data4': 4, 'Data5': 5 } ] } ]; This is how to do it: nv.addGraph(function() { var chart = nv.models.discreteBarChart() .x(function(d) { return d.Data1 }) .y(function(d) { return d.Data2 }) .tooltips(true) .tooltipContent(function(key, y, e, graph) { var data =graph.series.values[y-1]; return '<p> Text1: ' + data.Data3 + '<

My stacked area chart looks like this: The data I used has the same number of values and is just like in the example. THe data I used is at : http://pastebin.com/D07hja76 The code I use is also almost similar appart from the selector: var colors = d3.scale.category20(); keyColor = function(d, i) {return colors(d.key)}; nv.addGraph(function() { chart = nv.models.stackedAreaChart() .useInteractiveGuideline(true) .x(function(d) { return d.t }) .y(function(d) { return d.v }) .color(keyColor) .transitionDuration(300) chart.xAxis .tickFormat(function(d) { return d3.time.format('%x')(new Date(d)) });

I'm using nv.models.lineWithFocusChart , where I'm showing some hourly measurements. So the x domain is dates. What I need is to show a tick per hour on X axis: 00:00 01:00 02:00 ... 24:00 I've tried everything I could find but nothing works. It seems that its easy to set specific ticks when values are not dates. But can't figure out how to do it for dates. Here's the code that creates the graph, if it can help: nv.addGraph -> chart = nv.models.lineWithFocusChart(view) chart.yAxis.tickFormat(d3.format(".02f")) d3.select(graphSelector).datum([]).transition().duration(500).call(chart) nv.utils

I would like to force all tick marks and tick labels to appear along the axis in an rCharts nPlot from the nvd3 library. I have tried several approaches without success. This is the default behaviour: df <- data.frame(x = 1:13, y = rnorm(13)) library(rCharts) n <- nPlot(data = df, y ~ x, type = 'lineChart') n$yAxis(showMaxMin = FALSE) I would like to have all data in 1:13 show along the x axis. Ultimately, I have custom tickmarks I want to show equally-spaced with the following replacement: n$xAxis(tickFormat = "#! function (x) { ticklabels = ['0-1000', '1000-1500', '1500-1700', '1700-1820',

When I hover on the lines on the cumulative line chart I get a tooltip message x value at some y time. I want to edit this message and add more content. Since in my values array I have json containing {X:x, Y:y, Z:z, Dt:date} I wish to show a custom message listing X/Y/Z at date. edhenn I'm using nvd3 veraion 1.1.15b. Calling .tooltip() didn't work for me, but calling .tooltipContent() did, as in the following code: var chart = nv.models.pieChart() .x(function (d) { return d.file; }) .y(function (d) { return d.size; }) .tooltipContent(function (key, y, e, graph) { return '<h3>' + key + '</h3>'

This question relates to NVD3.js multiChart x-axis labels is aligned to lines, but not bars I am using NVD3.js multiChart to show multiple lines and multiple bars in the chart. All is working fine, but the x-axis labels is aligned only to the line points, not bars. I want to correctly align labels directly below the bars as it should. But I get this: As you can see - x-axis (example, 2014-Feb) is not aligned to Bars . 1) How to align x-axis labels to bars and lines at the same time ? 2) I need this solution for NVD3.js or how to properly integrate. I made jsFiddle: http://jsfiddle.net/n2hfN/28

Data: nvd3TestData = [ { values:[ {x:"M",y:1}, {x:"T",y:2}, {x:"W",y:3}, {x:"R",y:3}, {x:"F",y:4}, {x:"S",y:5}, {x:"U",y:6} ], key:"Apples" }, { values:[ {x:"M",y:5}, {x:"T",y:2}, {x:"W",y:6}, {x:"R",y:8}, {x:"F",y:2}, {x:"S",y:4}, {x:"U",y:1} ], key:"Zebras" } ] Creating the chart (pulled from an angularjs directive): nv.addGraph -> chart = nv.models.multiBarChart() .stacked(true) .showControls(false) chart.xAxis .axisLabel(attrs.xAxisLabel) chart.yAxis .axisLabel(attrs.yAxisLabel) .tickFormat(d3.format(',r')) console.log element d3.select(element[0].children[0]) .datum(nvd3TestData) .call