放大 dojox.charting.chart 时如何设置偏移量？答案

【问题标题】：How to set the offset when zooming on a dojox.charting.chart?放大 dojox.charting.chart 时如何设置偏移量？
【发布时间】：2011-12-13 18:12:12
【问题描述】：

我正在努力缩放道场图表。我的图表是这样在 javascript 中定义的：

var c2 = new dojox.charting.Chart("myChart");
c2.addPlot("default", {
                         type: "StackedAreas",
                         tension: 4
                            }).addAxis("x", {
                                    labels : labels
                            }).addAxis("y", {
                                    vertical: "true",
                                    fixLower: "major",
                                    fixUpper: "major"
                            }).setTheme(dojox.charting.themes.Tufte).addSeries("Series A", values).render();

然后，我有 2 个水平滑块，我想用它们从 x 轴的左右边界进行缩放。为此，我做了类似的事情：

dojo.connect(myMinSlider, "onChange", function(value) {
    var currentMin  = Math.ceil(value),
    currentMax = myMaxSlider.get('value'),
    // currentMax and currentMin are the values of the left and right sliders
    scale = theMaxValueOfMyXAxis / (currentMax - currentMin);
    offset = currentMin; // this is wrong... should be in "data coordinates" but I don't know what data coordinates refers to...
    c2.setAxisWindow("x", scale, offset, { duration: 500 }).render();
});

现在，缩放看起来不错，但偏移完全错误。 This tutorial 说“偏移量在数据坐标中”，但这里恐怕我没有理解“数据坐标”的含义。

假设 myMinSlider 值设置为 35，我希望图表的 X 轴从 35 开始。这就是我将其设置为 currentMin 值的原因。但是，我的图表移动到 Y 轴的左侧……离它应该的位置太远了……

我图表中的数据是一个如下所示的系列：

var data = [36,297,1202,205,160,130,122,121,120,111,116,65,118,123,118,104,144,114,141,216,134,216,89,89,103,95,85,95,93,101,103,98,96,116,119,129,112,104,107,103,86,100,107,81,117,96,105,115,115,116,129,117,116,127,129,121,125,118,133,128,128,136,110,142,152,144,162,154,154,134,148,166,140,168,154,158,177,186,169,210,202,230,232,237,226,251,298,313,410,469,614,765,982,1352,1796,2239,2806,3217,3800,4378,5083,5353,5728,6111,6000,6051,5901,5835,5569,5212,4736,4408,3816,3340,2782,2223,1909,1525,1218,1057,878,645,521,421,296,270,234,197,151,165,150,128,143,142,135,127,146,107,108,109,130,126,134,114,116,102,124,158,148,130,120,137,138,165,130,136,124,121,137,122,131,106,119,136,109,100,91,118,115,94,104,99,101,99,91,113,95,111,88,92,102,87,109,83,99,100,88,100,79,79,96,116,98,84,88,72,74,82,78,85,93,68,96,92,84,77,101,106,87,102,110,96,121,107,110,112,110,113,120,96,106,100,109,109,139,147,126,147,140,143,118,125,129,132,132,118,116,129,140,124,111,125,117,134,91,100,116,89,12]

有人有想法吗？

【问题讨论】：

感谢您的投票（如果您对我的回答投了票），如果它有效，您可以将其标记为最佳。请参阅我附加的链接 (sitepen.com/blog/2008/05/15/…) 他们解释了如何缩放/缩放/偏移。

标签： javascript charts dojo dojox.charting

【解决方案1】：

据我所知，您使用 chart.setAxisWindow(name, scale, offset)，例如

chart.setWindow(“x”, 3, 2)
chart.setWindow(“y”, 3, 1)

这会将 X 轴上的偏移量设置为 2，Y 轴上的偏移量设置为 1。

如果您想了解更多信息，请转到here

【讨论】：

是的，我知道。 setAxisWindow("x", scale, offset) 也可以。我的问题是偏移参数的行为很奇怪。医生说它应该是“数据规模”，这正是我不明白的。当我在我的示例中将其设置为 35 时，它会跳到一个更大的值。 Maybie 它代表我的“数据”数组中的第 35 个值：我必须检查...
嗨，如果您查看示例，您还可以看到另一种解决方法：chart.setWindow(scaleX, scaleY, offsetX, offsetY, {duration: 1500}).render();此功能将调整/缩放图形

【解决方案2】：

似乎解决方案比我预期的要简单得多：

chart.zoomIn(thAxis, [newStart, newEnd]);

【讨论】：