Javascript nvd3设置从大到小的比例
我有一个简单的折线图,其中Y值的范围是0-100。我想将Y范围反转为100-0。图形代码如下:Javascript nvd3设置从大到小的比例,javascript,d3.js,nvd3.js,Javascript,D3.js,Nvd3.js,我有一个简单的折线图,其中Y值的范围是0-100。我想将Y范围反转为100-0。图形代码如下: nv.addGraph(function() { var values = that.getGraphValues(); console.log(values); var chart = nv.models.lineChart() .forceY([100, 1]); chart.xAxis .axisL
nv.addGraph(function() {
var values = that.getGraphValues();
console.log(values);
var chart = nv.models.lineChart()
.forceY([100, 1]);
chart.xAxis
.axisLabel('Date')
.tickFormat(function(d) { return d3.time.format('%b %d')(new Date(d)); });
chart.yAxis
.axisLabel('Ranking')
.tickFormat(d3.format(',r'));
d3.select('#chart svg')
.datum(values)
.transition().duration(500)
.call(chart);
nv.utils.windowResize(function() { d3.select('#chart svg').call(chart) });
return chart;
});
您需要显式地设置图的域。在D3术语中,“域”是数据的预期范围。如果您不自行设置,则计算为
[minValue,maxValue]
。但您可以显式地将其设置为任何值,即使第一个值大于第二个值
var chart = nv.models.lineChart()
.yDomain([100,0]);
您需要显式地设置图的域。在D3术语中,“域”是数据的预期范围。如果您不自行设置,则计算为
[minValue,maxValue]
。但您可以显式地将其设置为任何值,即使第一个值大于第二个值
var chart = nv.models.lineChart()
.yDomain([100,0]);
如果您碰巧使用了包装器,设置自定义消息的方法是通过图表选项,简单地说:
$scope.options = {
chart: {
...
yDomain: [100, 1],
...
}
};
如果您碰巧使用了包装器,设置自定义消息的方法是通过图表选项,简单地说:
$scope.options = {
chart: {
...
yDomain: [100, 1],
...
}
};
P.S.
.forceX([numbers])
和forceY([numbers])
强制域包含这些数字,这些数字可以用来扩展域,但它们的顺序被忽略了——程序只是在从数据中将这些数字添加到数字数组的末尾后计算最大值和最小值。据我所知,forceX([数字])仍然不会颠倒顺序。虽然试过了,但它仍然不能颠倒顺序。@AceDimasuhid。我只是想解释为什么这种方法不起作用。直接设置y域就可以了.forceX([numbers])
和forceY([numbers])
强制域包含这些数字,这些数字可以用来扩展域,但是它们的顺序被忽略了——程序只是在从数据中将这些数字添加到数字数组的末尾后计算最大值和最小值。据我所知,forceX([数字])仍然无法反转顺序。尽管尝试过,但它仍然无法反转顺序。@AceDimasuhid完全正确。我提到它只是为了解释为什么这种方法不起作用。直接设置y域应该可以做到这一点。