문제

사용자가 날짜 범위를 확대 할 때 주석이 달린 타임 라인 그래프가 y 축에서 스케일을 자동으로 변경하도록하는 방법이 있습니까?

아래의 예를 확인하고 2009-10-09의 값 ( "가격")은 다른 값보다 약 2 가지 크기입니다. 사용자가 예를 들어 2009-10-01-299-10-08을 확대하면 y 축이 변경되지 않습니다 (그래프를 쓸모 없게 만듭니다). y 축을 자동으로 재조정하여 예제에서는 0에서 25까지의 범위 또는 더 합리적인 것입니다 (물론 사용자가 축소 할 때 기본값으로 돌아갑니다)?

예시: http://jsbin.com/ifogo

샘플 코드 (위의 링크와 동일) :

<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>
도움이 되었습니까?

해결책

사용해보십시오

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

해당 시각화에 대한 Google 페이지에는 사용할 수있는 다양한 옵션이 표시됩니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top