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

Error: [$injector:nomod] Module 'nvd3' is not available

I'm trying to implement this Angular-nvD3 chart. So far I have the following code: in my main index.html I have the following scripts included:
Anton Belev
  • 11,963
  • 22
  • 70
  • 111
0
votes
1 answer

Predefined filter for linePlusBarWithFocusChart

I'm trying to use linePlusBarWithFocusChart (angular-nvd3) in my application but i faced with the following problem - I cannot set initial range in the bottom chart (for example, i need to display values for a specific year in the upper chart and…
Roman
  • 11
  • 2
0
votes
1 answer

How can I use django-nvd3 to draw multi line chart with different values in X-axis?

All the examples I could find in searches to draw several lines in graph such as: https://github.com/areski/django-nvd3/blob/master/demoproject/demoproject/views.py#L66 use completely same values for x-axis. something like: start_time =…
Happy Ahmad
  • 1,072
  • 2
  • 14
  • 33
0
votes
1 answer

AngularJS Data Binding - Watch cycle not triggering

Assuming the following JSFiddle: https://jsfiddle.net/pmgq00fm/1/ I want my NVD3 chart to update in real time, based on the setInterval() on line 39 that updates the data the directive is bound to. Here are quick pointers on the architecture and…
Philippe Hebert
  • 1,616
  • 2
  • 24
  • 51
0
votes
1 answer

Angular-nvD3 Pie Chart Not Displaying

I am trying to follow a simple example to make a pie chart but it does not render the chart. Even viewing the source, no chart code appears (only the original directive code). The controller is getting loaded as I do see the log file statement and…
Eddy
  • 145
  • 14
0
votes
2 answers

nvd3 piechart.js - How to edit the tooltip? version 1.8

I have am using piechart by nvd3. Lately I upgraded nvd3 to 1.8.1 and I need to overwrite tooltip. This is my code from older version: piechartCurrent.tooltip.contentGenerator(function (obj) { content = '

Lucas03
  • 2,267
  • 2
  • 32
  • 60

0
votes
0 answers

nvd3 multiBarChart not showing x axis

Hi i tried to create a nvd3 multibarchart but i can't get x-axis display. I searched online but cannot find a solution to my issue. here is complete code please help. i also attached a pix for output. Thanks!