<!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. JS获取字符串实际长度(包含汉字)的简单方法

    方法一: var jmz = {}; jmz.GetLength = function(str) { ///<summary>获得字符串实际长度,中文2,英文1</summary&g ...

  2. vue之——从彩笔的进步之路

    因为这个文章开的有点晚,不可能说从头教学vue的使用,所以大概还是记录一下我的学习路线吧: 一开始是想学一个前端框架,最后选择了vue,一开始是看了表严肃的vue课程,b站有,讲的相当好,就算打个小广 ...

  3. NowCoder -- 牛客小白月赛10

    A--勘测 推下公式  a[i] = a[i-1] + a[i-2] +2 #include<stdio.h> #include<string.h> ]; int main() ...

  4. JSP总结(三)——JSP中九大内置对象(汇总)

    注:后缀为汇总的基本上是整理一些网上的. 一.九大内置对象分类: 1. request  请求对象 类型 javax.servlet.ServletRequest        作用域 Request ...

  5. 测试框架httpclent 1.HttpClient简介及第一个demo

    httpclient就是一个模拟 发送http请求的一个工具. 首先在pom.xml文件里面添加工具类 <dependencies> <dependency> <grou ...

  6. TensorFlow迁移学习的识别花试验

    最近学习了TensorFlow,发现一个模型叫vgg16,然后搭建环境跑了一下,觉得十分神奇,而且准确率十分的高.又上了一节选修课,关于人工智能,老师让做一个关于人工智能的试验,于是觉得vgg16很不 ...

  7. B-树（B树）详解

    具体讲解之前,有一点,再次强调下:B-树,即为B树.因为B树的原英文名称为B-tree,而国内很多人喜欢把B-tree译作B-树,其实,这是个非常不好的直译,很容易让人产生误解.如人们可能会以为B-树 ...

  8. 分布式监控系统开发【day38】:报警策略队列处理（五）

    一.目录结构 二.报警策略队列处理 1.入口MonitorServer import os import sys if __name__ == "__main__": os.env ...

  9. Java Properties 类读配置文件保持顺序

    前几天,公司项目中有一个需求是读取配置文件的,而且最好能够保证加载到内存中的顺序能够和配置文件中的顺序一致,但是,如果使用 jdk 中提供的 Properties 类的话,读取配置文件后,加载到内存中 ...

  10. React 记录(6)

    React文档:https://www.reactjscn.com/docs/react-component.html 慢慢学习:对照教程文档,逐句猜解,截图 React官网:https://reac ...