javascript - NVD3 line chart display X axis - Stack Overflow

admin管理员组

文章数量:1332628

I would like to make a line chart with nvd3(which is a collection of re-usable charts made with d3.js), which has y and x axis represented by a line.

Here is the line chart example from the official nvd3 site:

.html

I would like something like this, where the X axis line displayed:

.png

Has nvd3 any options for that? Is it even possible? Thanks.

I would like to make a line chart with nvd3(which is a collection of re-usable charts made with d3.js), which has y and x axis represented by a line.

Here is the line chart example from the official nvd3 site:

http://nvd3/examples/line.html

I would like something like this, where the X axis line displayed:

https://i.sstatic/RmzLA.png

Has nvd3 any options for that? Is it even possible? Thanks.

• javascript
• d3.js
• charts
• nvd3.js

Share Improve this question Follow edited Apr 14, 2015 at 8:50 Sebastian Bochan 37.6k33 gold badges5151 silver badges7575 bronze badges asked Apr 13, 2015 at 15:30 Márk FarkasMárk Farkas 1,54611 gold badge1414 silver badges2828 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

It looks like it's controlled by this CSS rule (nv.d3.css line 225):

.nvd3 .nv-axis.nv-x path.domain {
  stroke-opacity: 0;
}

Overriding that with your own CSS should show the line (at least, changing the value to 1 in the developer tools worked for me).

.nvd3 .nv-axis.nv-x path.domain, .nvd3 .nv-axis.nv-y path.domain {
  stroke: black;
  shape-rendering: crispEdges;
}

本文标签： javascriptNVD3 line chart display X axisStack Overflow