y 轴 - 最小-最大范围 - 角度 NVD3 - 折线图答案

【问题标题】：y axis - min-max range - Angular NVD3 - Line charty 轴 - 最小-最大范围 - 角度 NVD3 - 折线图
【发布时间】：2016-03-09 05:14:28
【问题描述】：

用法 - Angular NVD3 LineChart

我正在获取数据，但当数据为 0 时，它会绘制图表并绘制 y 轴 从范围 -1,0,1。

但我确实想绘制负 y 轴，因为我的数据永远不会是负数。

X 轴包含时间。

我的图表随着时间的推移而进展，问题就像前几分钟数据为 0，然后我将开始获取数据。

JavaScript 代码

$scope.options = {
                        chart: {
                            type: 'lineChart',
                            height: 120,
                            margin : {
                                top: 8,
                                bottom: 30,
                                left:40,
                                right:50,
                            },
                      color: ['#e4a91d','#444fa2','#de0000']
                    , showLegend: false
                    , wrapLabels: true
                    , tooltips:true
                    , reduceXTicks: false,


                            x: function(d){ return d[0]; },
                            y: function(d){ return d[1]; },

                            showDistY: true,
                            showDistX: true,
                            useInteractiveGuideline: true,
                            transitionDuration: 10,

                            xAxis: {
                                axisLabel: '',
                                tickFormat: function(d) {
                                    return d3.time.format('%H:%M')(new Date(d));
                                },
                                tickPadding: 10,
                                axisLabelDistance: 1,
                                ticks: 10,
                            },

                            yAxis: {
                                axisLabel: '1 / 2 / 3',
                                tickFormat: function(d){
                                    return d;
                                },
                                ticks: 4,
                            }
                        }
                    };

HTML 代码

<div>
    <nvd3 options="options" data="data" api="api"></nvd3>
</div>

截图

【问题讨论】：

标签： angularjs angularjs-directive linechart angular-nvd3

【解决方案1】：

我认为这应该可行。将这些添加到您的图表对象 yDomain: [0, maxY] // maxY being whatever you want your max y value to be 我在图表中使用了类似的东西。在这里找到它https://github.com/krispo/angular-nvd3/issues/47

【讨论】：