CODEWITHSUNDEEP
nvd3.js
balaji palamadai
balaji palamadai

Reputation: 629

Show all points in Chart - NVD3

I am using NVD3.js and I am trying to show all points in a chart by default. Without doing onhover, I want to view all points in chart, Please advise how can I achieve this.

thanks, Balaji

Upvotes: 1

Views: 1179

Answers (2)

Himanshu Dash
Himanshu Dash

Reputation: 21

Add custom attribute and class to your nvd3 tag and write some custom css for particular chart . 

<style>
    .line-chart[data-points="true"] .nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
        stroke-width: 6px;
        fill-opacity: 1;
        stroke-opacity: 0.7;
    }
</style>

` View In Plnkr

Upvotes: 1

ackuser
ackuser

Reputation: 5889

In some of them you can do something like showValues

nv.addGraph(function() {  
  var chart = nv.models.discreteBarChart()
      .x(function(d) { return d.label })
      .y(function(d) { return d.value })
      .staggerLabels(true)
      //.staggerLabels(historicalBarChart[0].values.length > 8)
      .tooltips(false)
      .showValues(true)

I saw you have put for "line chart" and I tried without success. Honestly, I have been trying with the default example, so I thought that maybe it makes no sense to show all the values because they are curves. What I mean is, it can be possible that for some reason when is rendering showvalues or similar is gonna try to show all the values in the curve and it won't work. Anyway, I am starting with nvd3 as well, but hope this help to figure it out how it can be done.

Upvotes: 0

Related Questions