Bar Chart slow zoom In/out - AmCharts

2019-07-26 08:46发布

问题:

While zooming my Bar amchart is rendering very slow when data is large, that is, 2975 points. Although, rendering is fine but it is lagging while zooming in/out using drag icon. The code is as below:

for(var i=0; i<title.length; i++) {
  var graphElem = {
             "title":title[i],
             "valueField":valueFields[i],
             "valueAxis":"v1",
              "type": "column",
              "fillAlphas": 0.8,
               "lineAlpha": 0.2
                 };
  graph.push(graphElem);
}


var chart = AmCharts.makeChart(graphType, {

  "type": "serial",
  "theme": "light",
  "pathToImages": "/grm/images/",
    "legend": {
        "equalWidths": false,
        "position": "bottom",
        "spacing": 3,
        "markerSize":8,
    },
  "dataProvider": dataProvider,
  "valueAxes": [ {
      "id":"v1",
        "axisThickness": 1,
        "gridAlpha": 0,
        "axisAlpha": 1,
        "position": "left",
        "integersOnly" : true
  } ],
  "columnSpacing" : 0,
  "graphs": graph,
   "chartScrollbar": {
       "dragIconHeight" : 25,
        "dragIconWidth" : 25
        },
  "chartCursor": {
    "cursorAlpha": 0,
    "cursorPosition": "mouse",
  "categoryBalloonDateFormat": "MMM DD, YYYY JJ:NN"
  },
  "categoryField": "linkTimestamp",
  "categoryAxis": {
    "parseDates": true,
  "axisColor": "#000000",
  "minPeriod": "mm"
  },
  "dataDateFormat": "YYYY-MM-DD HH:NN:SS"
} );

chart.addListener("dataUpdated", zoomChart);
zoomChart();
function zoomChart(){
    chart.zoomToIndexes(chart.dataProvider.length - 20, chart.dataProvider.length - 1);
}

if i use graph other than the bar(column) chart, zoom in/out is fast but it is lagging only in case of "type": "column". Please help where am i making mistake. Thanks

回答1:

Try to only allow the re-rendering to happen after the zoom by setting updateOnReleaseOnly to true.