简体   繁体   English

在Google Visualization API /带注释的时间线中自动重新缩放Y轴

[英]Automatic re-scaling of Y-axis in Google Visualization API / Annotated Time Line

Is there any way to force the Annotated Time Line graph to automatically change scale on the Y-axis when the user zooms in on a range of dates? 当用户放大一系列日期时,有没有办法强制注释时间线图自动改变Y轴上的比例?

Check example below, and note that the value ("price") for 2009-10-09 is about two magnitudes larger than the other values. 检查下面的示例,并注意2009-10-09的值(“价格”)比其他值大两个数量级。 When the user zooms in on eg 2009-10-01 -- 2009-10-08, the Y-axis is unchanged (making the graph pretty useless). 当用户放大时,例如2009-10-01 - 2009-10-08,Y轴不变(使图形相当无用)。 Is there a way to automatically rescale the Y-axis so that in this is example it would range from 0 to 25 or something more reasonable (and then of course back to the default when the user zooms out)? 有没有办法自动重新缩放Y轴,以便在这个例子中它的范围从0到25或更合理(然后当用户缩小时当然回到默认值)?

Example: http://jsbin.com/ifogo 示例: http//jsbin.com/ifogo

Sample code (same as in link above): 示例代码(与上面的链接相同):

<script src="http://www.google.com/jsapi"></script>
<div id="visualization" style="width: 800px; height: 400px;"></div>
<script>
google.load('visualization', '1', {packages: ['annotatedtimeline' ]});
function drawVisualization() {
  var data = new google.visualization.DataTable({
  cols: [{label: 'Date', type: 'date'}, {label: 'Price', type: 'number'}],
  rows: [
    { c:[{v: new Date(2009, 10, 1) }, {v: 11 }]},
    { c:[{v: new Date(2009, 10, 2) }, {v: 12 }]},
    { c:[{v: new Date(2009, 10, 3) }, {v: 13 }]},
    { c:[{v: new Date(2009, 10, 4) }, {v: 11 }]},
    { c:[{v: new Date(2009, 10, 5) }, {v: 10 }]},
    { c:[{v: new Date(2009, 10, 6) }, {v: 16 }]},
    { c:[{v: new Date(2009, 10, 7) }, {v: 22 }]},
    { c:[{v: new Date(2009, 10, 8) }, {v: 12 }]},
    { c:[{v: new Date(2009, 10, 9) }, {v: 999 }]},
]},0.6);
var annotatedtimeline = new google.visualization.AnnotatedTimeLine(document.getElementById('visualization'));
annotatedtimeline.draw(data);
}
google.setOnLoadCallback(drawVisualization);
</script>

Try using 尝试使用

annotatedtimeline.draw(data, {scaleType: 'maximized'});

Google's page on that visualization shows the various options you can use. 该可视化上的Google页面显示了您可以使用的各种选项。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM