Echart常用效果(一)

编程之家收集整理的这篇文章主要介绍了Echart常用效果(一)编程之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

搜索热词

代码实现

option = {
    backgroundColor: '#080b30',tooltip: {
        trigger: 'axis',axisPointer: {
            lineStyle: {
                color: {
                    type: 'linear',x: 0,y: 0,x2: 0,y2: 1,colorStops: [{
                        offset: 0,color: 'rgba(0,255,233,0)'
                    },{
                        offset: 0.5,color: 'rgba(255,1)',},{
                        offset: 1,0)'
                    }],global: false
                }
            },legend: {
        data: ['趋势'],itemHeight  :10,textStyle: {
            color: 'white'
        },icon: 'circle',right:0,grid: {
        top: '15%',left: '5%',right: '5%',bottom: '15%',containLabel: true
    },xAxis: [{
        type: 'category',axisLine: {
            show: false
        },axisTick: {
            show: false,splitArea: {
            color: '#f00',lineStyle: {
                color: '#f00'
            },axisLabel: {
            color: '#fff'
        },splitLine: {
            show: false
        },boundaryGap: false,data: ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31'
            ],}],yAxis: [{
        type: 'value',splitNumber: 4,splitLine: {
            show: true,lineStyle: {
                color: 'rgba(255,0.1)'
            }
        },axisLine: {
            show: true,axisLabel: {
            show: true,textStyle: {
                color: 'white',series: [
        {
            name: '趋势',type: 'line',smooth: true,//是否平滑
            symbol: 'none',lineStyle: {
                normal: {
                    color: "#fa517a",shadowColor: 'rgba(0,.3)',shadowBlur: 0,shadowOffsetY: 5,shadowOffsetX: 5,label: {
                show: false,position: 'top',textStyle: {
                    color: '#00ca95',}
            },itemStyle: {
                color: "#f9527d",borderColor: "#fff",borderWidth: 3,shadowOffsetY: 2,shadowOffsetX: 2,show:false,tooltip: {
                show: true
            },areaStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(0,1,[{
                            offset: 0,color: 'rgba(250,81,122,0.3)'
                        },{
                            offset: 1,0)'
                        }
                    ],false),shadowColor: 'rgba(250,0.1)',shadowBlur: 20
                }
            },data: [632,760,980,911,922,857,712,660,999,731,768,964,888,596,423,776,992,574,629,672,757,658,885,679,813,645,988,802],]
};

总结

以上是编程之家为你收集整理的Echart常用效果(一)全部内容,希望文章能够帮你解决Echart常用效果(一)所遇到的程序开发问题。

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您喜欢寻找一群志同道合、互帮互助的学习伙伴,可以点击下方链接加入:
编程之家官方1群:1065694478(已满)
编程之家官方2群:163560250(已满)
编程之家官方3群:312128206

相关文章

猜你在找的HTML相关文章

操作步骤 1、进入elasticsearch的plugin,进入ik。进入config。 2、在config下面建立以.dic为后缀的字典。在建立的时候一定要注意文本的报错格式,请保存为utf 8格式
lengend data数据中若存在'',则表示换行,用''切割。
问题原因 原因在于直接在js中取的变量并复制给var变量。 于是就变成这样。 解决办法 var data = '${content?js_string}';
前言 最近做了一个调查问卷导出的功能,需求是将维护的题目,答案,导出成word,参考了几种方案之后,选择功能强大的freemarker+固定格式之后的wordxml实现导出功能。导出word的代码是可
JSP中#{},${}和%{}的区别: # #{}:对语句进行预编译,此语句解析的是占位符?,可以防止SQL注入, 比如打印出来的语句 select * from table where id=?,预
对于很多人来说,用HTML标签都是熟能生巧,而不清楚为什么是那样的标签,所以我在这列了一个表,翻译了其对应的英文。 HTML 路径 相对路径 相对路径是指目标相对于当前文件的路径,网页结构设计中多采用
表单中的某个表单域被设定为disabled,则该表单域的值就不会被提交。 但是我们需要提交这个里面的默认值,这个时候需要使用readonly 但是readonly的样式不好看,会不像禁用状态,需要增加
前面业务里有个搜索功能 , 入口比较深 , 现在想要把入口挪到有公共header的地方 , 在不想完全实现一遍功能的情况下 , 就需要模拟进行多个点击事件来执行点击后的效果 执行先点击1 ,再给ino
微信公众号搜索 “ 程序精选 ” ,选择关注!
微信公众号搜 "程序精选"关注