2016-01-06 33 views
1

我有一個折線圖與虛擬數據說顯示值,因爲它是高和低限NVD3線圖

我的圖表繪製完美,但在Y軸上的值沒有顯示在數千人。 以下數據中的值將來自後端,僅限於數千種,因此需要解決方案以按原樣打印y軸。

[{"key":"City31","values":[["1990",6428.59],["1991",7079.34],["1992",4014.61],["1993",4000.77],["1994",4005.34],["1995",4182.21],["1996",4034.73],["1997",5891.87],["1998",4735.89],["1999",4039.58],["2000",4000],["2001",5030.29],["2002",4000.03],["2003",4000.43],["2004",4321.92],["2005",12575.87],["2006",4000],["2007",4027.99],["2008",4000],["2009",5087.42],["2010",6584.68],["2011",4000],["2012",4000],["2013",4000],["2014",29458.22],["2015",4068.58],["2016",4000.01],["2017",4000.12],["2018",4000],["2019",4003.91],["2020",8956.47],["2021",4000],["2022",4000],["2023",4000],["2024",4000],["2025",4264.9],["2026",4222.05],["2027",4039.94],["2028",4019.64],["2029",4000],["2030",4000.34],["2031",4279.83],["2032",4000],["2033",4006.69],["2034",4000],["2035",4000],["2036",4000],["2037",4000],["2038",4000],["2039",4000],["2040",4000],["2041",4000],["2042",4000],["2043",4627.18],["2044",4000],["2045",4000],["2046",4000],["2047",4000.11],["2048",4000],["2049",4000.04],["2050",4000.19]]},{"key":"City32","values":[["1990",6428.59],["1991",7079.34],["1992",4014.61],["1993",4000.77],["1994",4005.34],["1995",4182.21],["1996",4034.73],["1997",5891.87],["1998",4735.89],["1999",4039.58],["2000",4000],["2001",5030.29],["2002",4000.03],["2003",4000.43],["2004",4321.92],["2005",12575.87],["2006",4000],["2007",4027.99],["2008",4000],["2009",5087.42],["2010",6584.68],["2011",4000],["2012",4000],["2013",4000],["2014",29458.22],["2015",4068.58],["2016",4000.01],["2017",4000.12],["2018",4000],["2019",4003.91],["2020",8956.47],["2021",4000],["2022",4000],["2023",4000],["2024",4000],["2025",4264.9],["2026",4222.05],["2027",4039.94],["2028",4019.64],["2029",4000],["2030",4000.34],["2031",4279.83],["2032",4000],["2033",4006.69],["2034",4000],["2035",4000],["2036",4000],["2037",4000],["2038",4000],["2039",4000],["2040",4000],["2041",4000],["2042",4000],["2043",4627.18],["2044",4000],["2045",4000],["2046",4000],["2047",4000.11],["2048",4000],["2049",4000.04],["2050",4000.19]]}] 

代碼:

nv.addGraph(function() { 
     var chart = nv.models.cumulativeLineChart() 
         .x(function(d) { return d[0] }) 
         .y(function(d) { return d[1] }) //adjusting, 100% is 1.00, not 100 as it is in the data 
         .color(d3.scale.category10().range()) 
         .useInteractiveGuideline(false); 
     //chart.yAxis.tickFormat(d3.format(',.0d')); 
     d3.select('#chart2 svg') 
      .datum(chartdata) 
      .call(chart); 
     nv.utils.windowResize(chart.update); 
return chart; 
    }); 

輸出: enter image description here

+1

y比例是cumulativeLineChart中的百分比,你傳遞的值高達7079.34這就是爲什麼它的繪製比例尺錯誤的原因......查看你的值應該使用簡單的折線圖 – Cyril

+1

感謝Cyril **已解決問題* * –

回答

1

您應該使用折線圖不累計圖表。

var chart = nv.models.lineChart() 
       .x(function(d) { return d[0] }) 
       .y(function(d) { console.log(d);return d[1] }) 
       .color(d3.scale.category10().range()) 
       .useInteractiveGuideline(true) 
       ; 

工作代碼here

希望這有助於!