2016-12-28 10 views
0

私はAmChartsでグラフを持っていますが、グラフの一番下にスクロールを開始したいと思います。chartScrollbar AmCharts

var chart = AmCharts.makeChart("chartdiv", { 
    "type": "serial", 
    "theme": "light", 
    "rotate":true, 
    "maxSelectedSeries": 4, 
    "mouseWheelScrollEnabled": true, 
    "marginRight": 70, 
    "dataProvider": [{ 
    "country": "USA", 
    "visits": 3025, 
    "color": "#FF0F00" 
    }, { 
    "country": "China", 
    "visits": 1882, 
    "color": "#FF6600" 
    }, { 
    "country": "Japan", 
    "visits": 1809, 
    "color": "#FF9E01" 
    }, { 
    "country": "Germany", 
    "visits": 1322, 
    "color": "#FCD202" 
    }, { 
    "country": "UK", 
    "visits": 1122, 
    "color": "#F8FF01" 
    }, { 
    "country": "France", 
    "visits": 1114, 
    "color": "#B0DE09" 
    }, { 
    "country": "India", 
    "visits": 984, 
    "color": "#04D215" 
    }, { 
    "country": "Spain", 
    "visits": 711, 
    "color": "#0D8ECF" 
    }, { 
    "country": "Netherlands", 
    "visits": 665, 
    "color": "#0D52D1" 
    }, { 
    "country": "Russia", 
    "visits": 580, 
    "color": "#2A0CD0" 
    }, { 
    "country": "South Korea", 
    "visits": 443, 
    "color": "#8A0CCF" 
    }, { 
    "country": "Canada", 
    "visits": 441, 
    "color": "#CD0D74" 
    }], 
    "valueAxes": [{ 
    "axisAlpha": 0, 
    "position": "left", 
    "title": "Visitors from country" 
    }], 
    "startDuration": 1, 
    "graphs": [{ 
    "balloonText": "<b>[[category]]: [[value]]</b>", 
    "fillColorsField": "color", 
    "fillAlphas": 0.9, 
    "lineAlpha": 0.2, 
    "type": "column", 
    "valueField": "visits" 
    }], 
    "chartCursor": { 
    "categoryBalloonEnabled": false, 
    "cursorAlpha": 0, 
    "zoomable": false 
    }, 
    "categoryField": "country", 
    "categoryAxis": { 
    "gridPosition": "start", 
    "labelRotation": 45 
    }, 
    "chartScrollbar": { 
    //"graph": "Not set", 
    "backgroundColor":"#2f373e", 
    "graphType": "smoothedLine", 
    "resizeEnabled": false, 
    "scrollbarHeight": 15, 
    "scrollDuration": 0, 
    "updateOnReleaseOnly": true 
    } 

}); 

jsfiddle

あなたはjsfiddleにスクロールバーを見ることができるように、グラフの下部に始まり、私は最初の結果を確認するために、グラフの一番上までスクロールする必要があります。

答えて

1

maxSelectedSeriesプロパティが設定されているため、チャートが最後までズームしているように見えます。チャートは、初期化時に最後の〜xシリーズにズームします。あなたはzoomToIndexesを呼び出すことによってinitilation時に目的の場所にズームを設定しますinitリスナーを追加することでこの問題を回避することができます

var chart = AmCharts.makeChart("chartdiv", { 
    // ... 
    "listeners": [{ 
    "event": "init", 
    "method": function(e) { 
     e.chart.zoomToIndexes(0, 4); 
    } 
    }] 
}); 

Updated fiddle

+0

はあなたのソリューションのためのあなたにたくさんありがとうございました!! – Caru