Stack Overflow
Stack Overflow

Questions tagged [nvd3.js]

NVD3.js is a library of re-usable charts and chart components for D3.js.

NVD3 - A reusable charting library

Inspired by the work of Mike Bostock's Towards Reusable Charts, and supported by a combined effort of Novus and the NVD3 community.

Usage

Simply add the nv.d3 assets to your project and include them in your HTML.

<link href="nv.d3.min.css" rel="stylesheet">
<script src="nv.d3.min.js"></script>
  • nv.d3.js should appear after d3.js is included.
  • Prefer minified assets (.min) for production.

Dependencies

NVD3 should work with the latest d3.js version 3.5.3 and later.

Minimum D3 version required: 3.4.4

Along with pieChart options padAngle and cornerRadius, the interactive guideline tooltip now requires these later versions of D3 (3.4.4+, specifically, to get interactive tooltips). The interactive guide lines rely on the more recent d3.bisector() method which treats accessors taking two parameters (the second being the element index) as comparators (see d3.bisector()).

Supported Browsers

NVD3 runs best on WebKit based browsers.

  • Google Chrome: latest version
  • Opera 15+ (i.e. webkit version)
  • Safari: latest version
  • Firefox: latest version
  • Internet Explorer: 10+

Related tags

1828 questions
0
votes
1 answer

Filter with datum in D3js?

Is it possible to do a filtering by binding data with function datum()? I tried to do so but the function filter() ran once and it filtered the data with all or nothing.
Adam Aiken
  • 418
  • 7
  • 18
0
votes
1 answer

How to select nested data elements in d3

I am a newbie and trying to play around with my data. I first visualize these circles as following: circle = svg.selectAll('circle') .data(dataFile) .enter() .append("circle") .attr("stroke", "black") …
Bahador Saket
  • 995
  • 1
  • 12
  • 24
0
votes
1 answer

How to append element after grouping my circles in D3?

I have a bunch of circles. I first visualize the circles as following: circle = svg.selectAll('circle') .data(csv) .enter() .append("circle") .attr("stroke", "black") .attr("id", function(d,i){return "id_" +…
Bahador Saket
  • 995
  • 1
  • 12
  • 24
0
votes
1 answer

Freeze Y-Axis label in d3.js

I'm trying to freeze the Y-Axis labels while scrolling. I tried to put position:fixed; in style of Y-axis but doesn't seems working. Anyone came across any situation like this?
Govind Mantri
  • 803
  • 1
  • 11
  • 24
0
votes
1 answer

NVD3 Scatter Plot Point Opacity

I been trying to set the opacity of the points of a scatter plot generate by nvd3. I tried to use CSS to set the opacity of the points but it didn't work. Any idea on how to set the opacity? This is the code that I use to generate the graph: var…
thgnuyen
  • 139
  • 1
  • 9
0
votes
1 answer

D3: Cannot select an item based on its id

I would like to visualize a bunch of circles on my screen and make them dragable. I am assigning an unique id to each circle. Later I am trying to select a particular circle by its id inside the on("dragend", ..) event but I am receiving following…
Bahador Saket
  • 995
  • 1
  • 12
  • 24
0
votes
1 answer

Angular Nested Directive Data Binding

I am using angular-nvd3 in a project. It exposes an element directive that looks like so:
This renders a chart according to the options and data values. It has two way data binding for the options and data…
dacox
  • 502
  • 1
  • 6
  • 14
0
votes
2 answers

Legend different from labels, Pie Chart, Angular-nvD3

I would like to display "Not acknowledged" and "Acknowledged" in the legend, and have the amounts display as labels on the pie chart. I do not see a way of accomplishing this in the directive…
user1824797
  • 89
  • 2
  • 11
0
votes
2 answers

What option controls the linewithFocusChart focus area (Angular-nvD3)?

I am trying to modify the linewithFocusChart's focus properties (the focus being the small navigable viewport beneath the main chart) using the focus options (focusEnable, focusHeight, etc). These options are not having any affect on my graph…
user1824797
  • 89
  • 2
  • 11
0
votes
1 answer

How can I add some text to the tooltip of NVD3 discreteBarChart?

I tried to add some text to my tooltip of my nvd3 discreteBarChart, but it doesnt work and i dont know why. It shows me always when I go above the tooltip the following: [object Object] undefined cal . Do you have a idea for me? historicalBarChart =…
johny
  • 159
  • 1
  • 13
0
votes
1 answer

nvd3 and angularjs multi bar chart

I am trying to plot a multi bar chart with angular and nvd3. The html part is
Kelly Goedert
  • 1,027
  • 2
  • 11
  • 37
0
votes
1 answer

How to increase NVD3JS Pie-Chart label size

I try to increase the label size of my nvd3js pie-chart, because it's really tiny. So I've read about doing this like this : or
…
TobiasW
  • 861
  • 3
  • 13
  • 36
0
votes
1 answer

AngularJS calling xml file and processing data

I'm new to javascript coding in general and I'm having some issues with creating an angular chart using a custom xml file. I'm using x2js to convert my xml file to json in order to be used in the data for the chart. In my plnkr, I created an angular…
Nick Borisenko
  • 494
  • 3
  • 18
0
votes
4 answers

How to fill area with custom color under line in nvd3 linechart ?

I'm working with nvd3 and I'm not much hands-on with its styling (css properties) to customize it. I have a line chart with two data lines on it. The code for drawing the lines is following: nv.addGraph(function() { chart =…
Omar Bahir
  • 1,237
  • 5
  • 20
  • 48
0
votes
1 answer

Scientific notation on axes in plot from django-nvd3

I have tried for hours now to find any documentation on this, but it doesn't appear to exist. After battling for days to get any of the methods for creating and showing plots in Django to work, I finally managed to get nvd3 for django working. But…
Frank
  • 619
  • 1
  • 6
  • 26
1 2 3
…
99 100