<!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. Linux程序宕掉后如何通过gdb查看出错信息

    我们在编写服务端程序的时候,由于多线程并且环境复杂,程序可能在不确定条件的情况下宕掉,还不好重新,这是我们如何获取程序的出错信息,一种方法通过打日志,有时候一些错误日志也不能体现出来,这时就用到我们的 ...

  2. CSS属性速查表

    前面的话 本文将按照布局类属性.盒模型属性.文本类属性.修饰类属性这四个分类,对CSS常用属性进行重新排列,并最终设置为一份stylelintrc文件 布局类 1.定位 position z-inde ...

  3. 三、Java多人博客系统-技术架构

    多人博客系统1.0版本,架构和技术还是很简单和很传统的. 1.技术 前端:jsp.html.css.javascript.jquery.easyui.echarts 后端:spring mvc.Hib ...

  4. SQLServer 中多行数据合并成一行数据（一个字段）

    需求:有四行数据,如下: 1.苹果 2.橘子 3.桃子 4.波罗 合并成一个字段:苹果,橘子,桃子,波罗: 需求明确之后,先弄点测试数据,上代码: --创建一个临时表 Create table #te ...

  5. Magento Meigee-Glam 主题的用法

    Start起点 Package Structure包装结构 License许可证 Installation安装 What's new Updated!更新了什么! Theme options主题选项 ...

  6. python版接口自动化测试框架源码完整版（requests + unittest）

    python版接口自动化测试框架:https://gitee.com/UncleYong/my_rf [框架目录结构介绍] bin: 可执行文件,程序入口 conf: 配置文件 core: 核心文件 ...

  7. CAN总线报文浅析

    CAN的报文格式 在总线中传送的报文,每帧由7部分组成.CAN协议支持两种报文格式,其唯一的不同是标识符(ID)长度不同,标准格式为11位,扩展格式为29位. 在标准格式中,报文的起始位称为帧起始(S ...

  8. 金融量化分析【day113】：多因子选股

    一.什么是多因子选股 在股市中征战过的朋友们应该知道,股市之道无非三点.1择时,2选股,3 仓控.精通这三点中的任何一点,都足以在股市中所向披靡.但是精通二字何其艰难!!!矫情的话多不多说,咱们进入正 ...

  9. 第八节: EF的性能篇(一) 之 EF自有方法的性能测试

    一. 开发中常见的性能问题 我们在日常开发过程中,由于一些不好的习惯,经常会导致所写的代码性能低下,却毫无发觉,下面就总结一下常见的一些性能问题. 1. 真假分页 ① 假分页: db.xxx.toLi ...

  10. File Upload XSS

    A file upload is a great opportunity to XSS an application. User restricted area with an uploaded pr ...