NVD3.js 折线图无法将 y 轴缩放到最大值和最小值答案

【问题标题】：NVD3.js line graphs fail to scale y axis to max and min valuesNVD3.js 折线图无法将 y 轴缩放到最大值和最小值
【发布时间】：2014-05-29 13:32:04
【问题描述】：

构建一个包含多个图表的页面，我决定使用 NVD3。

问题是NVD3找不到最大值，渲染了一些无用的图形。

http://jsfiddle.net/pxU8c/

function renderGraph(parent, data) {
    function getGraph(svgElement, data) {
        var height = 500;

        var chart = nv.models.lineChart()
        chart.options({
            noData: "Not enough data to graph",
            transitionDuration: 500,
            showLegend: true,
            showXAxis: true,
            showYAxis: true,
            rightAlignYAxis: false
        });

        chart.xAxis     //Chart x-axis settings
            .axisLabel(data['x-label'])
            .tickFormat(function(d) {
                return d3.time.format('%d.%m.%Y')(new Date(+d))
            });

        chart.yAxis     //Chart y-axis settings
            .axisLabel(data['y-label'])
            .tickFormat(d3.format('.02f'))
        ;

        svgElement    //Select the <svg> element you want to render the chart in.
            .datum(data['data'])         //Populate the <svg> element with chart data...
            .call(chart);          //Finally, render the chart!

        //Update the chart when window resizes.
        nv.utils.windowResize(function() { chart.update() });
        return chart;
    }
    var svgELement = d3.select('svg#chart_'+data['code']);
    nv.addGraph(getGraph(svgELement, data));
}

如果有帮助的话，我也在使用 twitter bootstrap 进行布局。

编辑

跟随小提琴应该更有用，因为它包含更少的垃圾 http://jsfiddle.net/Bh578/

第一个和第二个图表显示问题，而第三个图表根据我的期望呈现（即您可以看到整行）

我还添加了 useInteractiveGuideline: true 选项，因此我也希望在图表上看到可见图形区域之外的值。

【问题讨论】：

fails to find the maximum value 是什么意思，通过查看图表，您的数据集可能存在问题。您到底想在这里实现什么目标？？
嗨 @shabeer90, fails to find the maximum value 表示 y 轴上的值集在某些图上比其他图小得多，对我来说没有明显的系统。预期的行为是任何数据集都将呈现整条线可见的图形，但显然情况并非如此。我不知道要寻找什么数据集问题，请您给我一些指示吗？都是整数，带有 javascript 的弱类型，将它们表示为字符串应该不是问题，对吧？非常感谢
我遇到了类似的问题。 NVD3 没有使用最大 Y 值作为轴最大值。相反，它使用了一个不同的、更小的值。我所有的值都是 Fixnum（Fixnum 是 Integer 的子类）。有什么想法吗？

标签： javascript html twitter-bootstrap d3.js nvd3.js

【解决方案1】：

值应该是整数，而不是 JSON-decoded-as-strings 整数，那么它就像一个魅力。

【讨论】：

这对我来说非常有效，刚刚为我的y 函数返回了Number(d.y)。每次更新图表时都为计算最大 Y 省去了很多麻烦...谢谢！