echarts4.0折线图让某个点闪烁 

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <script src="static/jquery.js"></script>
 7         <script src="static/echarts4.js"></script>
 8     </head>
 9     <script>
10         $(function() {
11             var x = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
12             var series = [{
13                 name: '总量',
14                 type: 'line',
15                 label: {
16                     normal: {
17                         show: true,
18                         position: 'top'
19                     }
20                 },
21                 data: [0, 50, 100, 150, 200, 150, 100]
22             }]
23             var option = {
24                 xAxis: [{
25                     type: 'category',
26                     boundaryGap: false,
27                     data: x
28                 }],
29                 yAxis: [{
30                     type: 'value'
31                 }],
32                 series: series
33             };
34             var effectScatterData = [0, 50, 100, 150, 200, {value:150,symbolSize:30,}, 100]
35             var effectScatter = {
36                 type: 'effectScatter',
37                 coordinateSystem: 'cartesian2d',
38                 data: effectScatterData, //2d坐标系
39                 symbolSize:0,
40                 showEffectOn: 'render',
41                 rippleEffect: {
42                     brushType: 'stroke'
43                 },
44                 hoverAnimation: true,
45                 itemStyle: {
46                     normal: {
47                         color: 'red',
48                         shadowBlur: 10,
49                         shadowColor: '#333'
50                     }
51                 },
52                 zlevel: 1
53             };
54             option.series.push(effectScatter);
55             myChart = echarts.init(document.getElementById('fleshChart'));
56             myChart.setOption(option)
57         })
58     </script>
59 
60     <body>
61         <div id="fleshChart" style="width:100%;height:500px;">
62         </div>
63     </body>
64 
65 </html>

 

posted @ 2018-06-11 01:54  神奇的小胖子  阅读(6410)  评论(0)    收藏  举报