<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title></title>

         <script src="static/jquery.js"></script>

         <script src="static/echarts4.js"></script>

     </head>

     <script>

         $(function() {

             var x = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];

             var series = [{

                 name: '总量',

                 type: 'line',

                 label: {

                     normal: {

                         show: true,

                         position: 'top'

                     }

                 },

                 data: [0, 50, 100, 150, 200, 150, 100]

             }]

             var option = {

                 xAxis: [{

                     type: 'category',

                     boundaryGap: false,

                     data: x

                 }],

                 yAxis: [{

                     type: 'value'

                 }],

                 series: series

             };

             var effectScatterData = [0, 50, 100, 150, 200, {value:150,symbolSize:30,}, 100]

             var effectScatter = {

                 type: 'effectScatter',

                 coordinateSystem: 'cartesian2d',

                 data: effectScatterData, //2d坐标系

                 symbolSize:0,

                 showEffectOn: 'render',

                 rippleEffect: {

                     brushType: 'stroke'

                 },

                 hoverAnimation: true,

                 itemStyle: {

                     normal: {

                         color: 'red',

                         shadowBlur: 10,

                         shadowColor: '#333'

                     }

                 },

                 zlevel: 1

             };

             option.series.push(effectScatter);

             myChart = echarts.init(document.getElementById('fleshChart'));

             myChart.setOption(option)

         })

     </script>

     <body>

         <div id="fleshChart" style="width:100%;height:500px;">

         </div>

     </body>

 </html>

echarts4.0折线图让某个点闪烁的更多相关文章

  1. [vue折线图] 记录SpringBoot+Vue3.0折线图订单信息展示

    因公司业务需求,需要做一份订单相关的折线图, 如果其中有一天没有订单的话,这一天就是空缺的,在绘制折线图的时候是不允许的,所有要求把没有订单数据的日期也要在图表显示. 使用技术vue3.0+sprin ...

  2. jquery和highcharts折线图、柱形图、饼状图-模拟后台传參源代码

    js代码: <script type="text/javascript"> $(function(){ showLine(); showColumn(); showPi ...

  3. HighCharts实现多数据折线图分列显示

    HighCharts实现多数据折线图分列显示 BY ZYZ HighCharts是一个很好用的web端绘图插件,用起来很方便,它的官方支持很好.并且有中文API(不全然).画出来的图像也挺美丽的. 近 ...

  4. OpenGL（十七） 绘制折线图、柱状图、饼图

    一.绘制折线图 glutBitmapCharacter(GLUT_BITMAP_8_BY_13,label[j])函数可以绘制GLUT位图字符,第一个参数是GLUT中指定的特定字形集,第二个参数是要写 ...

  5. MPAndroidChart 3.0——LineChart（折线图）

    显示效果 MPAndroidChart每一种图表的基本使用方式都基本相同 了解一种图表的实现 参考项目源码其他的图表也就差不多哩 在布局文件中定义 <com.github.mikephil.ch ...

  6. chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]

    chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法,原文:http://bubuko.com/infodetail-328671.html 默认情况下如下图 Y轴并不是从0开始 ...

  7. echarts、higncharts折线图或柱状图显示数据为0的点

    echarts.higncharts折线图或柱状图只需要后端传到前端一段json数据,接送数据的x轴与y周有对应数据,折线图或柱状图就会渲染出这数据. 比如,x轴表示美每天日期,y轴表示数量.他们的数 ...

  8. vue中使用 echarts3.0 或 echarts2.0 (模拟迁徙图，折线图)

    一.echarts3.0(官网: http://echarts.baidu.com/) 首先通过npm安装echarts依赖,安装的为3.0版本 npm install echarts -s 也可以使 ...

  9. 基于SpringMVC框架使用ECharts3.0实现折线图，柱状图，饼状图,的绘制（上篇）

    页面部分 <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE html> ...

随机推荐

  1. Maven基础：Maven环境搭建及基本使用（1）

    1. Maven环境搭建 1.1 Maven简介 1.2 Maven下载及环境设置 Maven下载地址:http://maven.apache.org/download.cgi 当前下载版本:apac ...

  2. 爬虫免登录进入github

    import requests import re ret = requests.get('https://github.com/login') print(ret.headers) cookies ...

  3. Ueditor注意的地方

    复制粘贴内容到编辑器上时,一些标签的属性会被过滤,在config.js里添加白名单配置项,例如: whitList: { a: ['target', 'href', 'title', 'class', ...

  4. shell之数组和关联数组

    数组和关联数组 #!/bin/bash #定义数组1 array_var1=(1 2 3 4 5 6)# #定义数组2 array_var[0]="test1" array_var ...

  5. radio,check美化

    单选框与复选框原生控件美化有多种解决方案,现在采用经典的input+label的方式自己实现一种 思路: input 和label 通过id和for属性关联,点击label时,input选中状态改变 ...

  6. jmeter5.1测试dubbo接口

    dubbo接口功能介绍 客户端输入uncleyong(当然,也可以是其他字符串),服务端返回hello uncleyong 开发dubbo服务jmeter客户端 idea中创建模块dubbo_jmet ...

  7. Beamer 跳到另外一页

    \documentclass[english]{beamer}\usepackage{babel} \begin{document} \begin{frame}\frametitle{the refe ...

  8. [再寄小读者之数学篇](2014-04-18 from 352558840@qq.com [南开大学 2014 年高等代数考研试题]反对称矩阵的组合)

    (2014-04-18 from 352558840@qq.com [南开大学 2014 年高等代数考研试题]反对称矩阵的组合) 设 ${\bf A},{\bf B}$ 都是反对称矩阵, 且 ${\b ...

  9. [物理学与PDEs]第3章第3节 电导率 $\sigma$ 为无穷时的磁流体力学方程组 3.3 磁场线``冻结''原理

    磁场线``冻结''原理: 在 $\sigma=\infty$ 时, 初始时刻分布在同一磁场线上的质点, 在运动过程中会一直保持在同一磁场线上, 即磁场线好像``冻结''在物质上. 事实上, $\cfr ...

  10. [译]Ocelot - Big Picture

    原文 目录 Big Picture Getting Started Configuration Routing Request Aggregation Service Discovery Authen ...