Highcharts中的點動畫

如何使用Highcharts中的某個點動畫圖形？Highcharts中的點動畫

看看這個。我可以說'從點[Date.UTC(1997,1,0),5.5]'生成動畫？或者只動畫一個系列？

因此，[Date.UTC(1997,1,0),5.5]之前的所有內容都不應該生成動畫，並且只能在圖形加載時「待在那裏」。

chart = new Highcharts.Chart({ 
    exporting: { 
     enabled: false 
    }, 
    chart: { 
     renderTo: 'container', 
     type: 'spline', 
     marginRight: 20 
    }, 
    title: { 
     text: 'Kortetermijnraming CPB' 
    }, 
    subtitle: { 
     text: 'Werkloosheid stijgt tot 6%' 
    }, 
    xAxis: { 
     max: Date.UTC(2013, 1, 0), 
     type: 'datetime', 
     dateTimeLabelFormats: { // don't display the dummy year 
      month: '%Y', 
      year: '%Y' 
     } 
    }, 
    yAxis: { 
     min: 0, 
     title: { 
      text: 'Werkloosheid (%)' 
     }, 

     plotLines: [{ 
      value: 0, 
      width: 2, 
      color: '#000000', 
      zIndex: 5 
     }, { 
      label: { 
       text: 'Werkloosheid', 
       x: 0, 
       align: 'right' 
      }, 
      value: 5, 
      width: 0.5, 
      color: '#ffffff', 
      zIndex: 1 
     }] 
    }, 
    tooltip: { 
     formatter: function() { 
      return '<b>' + this.series.name + '<br/>' + Highcharts.dateFormat('%Y', this.x) + ':</b> ' + this.y + '%'; 
     } 
    }, 

    plotOptions: { 
     series: { 
      animation: { 
       duration: 5000 
      } 
     }, 
     spline: { 
      lineWidth: 3, 
      states: { 
       hover: { 
        lineWidth: 4 
       } 
      }, 
      marker: { 
       enabled: false, 
       states: { 
        hover: { 
         enabled: true, 
         symbol: 'circle', 
         radius: 4, 
         lineWidth: 1 
        } 
       } 
      } 
     } 
    }, 
    legend: { 
     enabled: false 
    }, 
});

來源

2012-12-28 Jerry Vermanen

動畫添加到意甲：

serie: [{ 
    animation: { 
     duration: 5000 
    }, 
    ... 
}]

demo

來源

2012-12-28 11:05:14

Highcharts中的點動畫

回答

相關問題