不静之心

总是乐于收藏和分享,有助于个人成长
  • 首页
  • 专业技术
    • 前端
      • javascript
      • 美工
    • 服务端
      • 设计模式
        • 创建型模式
        • 结构型模式
        • 行为型模式
      • Java
      • J2EE
      • Spring
      • Hibernate&Mybatis
      • PHP
      • Python
      • 工作流
    • 移动
    • 数据库
      • 大数据
    • 加解密
  • 专业工具
    • OS
    • 开源软件
    • Maven
    • WordPress
  • 我的收藏
    • 应用软件收藏
    • Android使用记录
    • 前端收藏
      • 移动开发框架插件收集
      • 优秀网站收集
      • CSS3效果插件
      • JS优秀插件收集
      • 图片图表图标插件
      • 前台美工和Bootstrap资源收集
      • 布局,表格,分页
    • 后端收藏
      • Linux软件收集
      • 使用Docker记录
      • Centos使用记录
      • 应用系统收藏
      • Java的特性
    • 经验收藏
    • 其他收藏
  • Linux命令
  • 现实生活
    • 梦里故乡
  • 相册
    • 我的摄影
    • 故乡
    • 生活
    • 人物
    • 风景
    • 其他
  • 经历
  • 首页
  • 专业技术
    • 前端
      • javascript
      • 美工
    • 服务端
      • 设计模式
        • 创建型模式
        • 结构型模式
        • 行为型模式
      • Java
      • J2EE
      • Spring
      • Hibernate&Mybatis
      • PHP
      • Python
      • 工作流
    • 移动
    • 数据库
      • 大数据
    • 加解密
  • 专业工具
    • OS
    • 开源软件
    • Maven
    • WordPress
  • 我的收藏
    • 应用软件收藏
    • Android使用记录
    • 前端收藏
      • 移动开发框架插件收集
      • 优秀网站收集
      • CSS3效果插件
      • JS优秀插件收集
      • 图片图表图标插件
      • 前台美工和Bootstrap资源收集
      • 布局,表格,分页
    • 后端收藏
      • Linux软件收集
      • 使用Docker记录
      • Centos使用记录
      • 应用系统收藏
      • Java的特性
    • 经验收藏
    • 其他收藏
  • Linux命令
  • 现实生活
    • 梦里故乡
  • 相册
    • 我的摄影
    • 故乡
    • 生活
    • 人物
    • 风景
    • 其他
  • 经历
首页 / javascript / 开源软件 / echarts混合图形

echarts混合图形

echarts混合图形 2019年6月10日 不静之心 javascript开源软件

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
var myChart = echarts.init(document.getElementById('analysis-canvas2'));
        var option = {
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    crossStyle: {
                        color: '#999'
                    }
                }
            },
            legend: {
                data: ['蒸发量', '降水量', '平均温度', '直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
            },
            xAxis: [{
                type: 'category',
                data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
                axisPointer: {
                    type: 'shadow'
                }
            }],
            yAxis: [{
                type: 'value',
                name: '水量',
                min: 0,
                max: 250,
                interval: 50,
                axisLabel: {
                    formatter: '{value} ml'
                }
            }, {
                type: 'value',
                name: '温度',
                min: 0,
                max: 25,
                interval: 5,
                axisLabel: {
                    formatter: '{value} °C'
                }
            }],
            series: [{
                name: '蒸发量',
                type: 'bar',
                data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
            }, {
                name: '降水量',
                type: 'bar',
                data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
            }, {
                name: '平均温度',
                type: 'line',
                yAxisIndex: 1,
                data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
            }, {
                name: '访问来源',
                type: 'pie',
                radius: '55%',
                center: ['50%', '60%'],
                data: [
                    {value: 335, name: '直接访问'},
                    {value: 310, name: '邮件营销'},
                    {value: 234, name: '联盟广告'},
                    {value: 135, name: '视频广告'},
                    {value: 1548, name: '搜索引擎'}
                ],
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }]
        };
        myChart.setOption(option);

 

后一篇
前一篇

发表评论 取消回复

电子邮件地址不会被公开。

后一篇
前一篇

  •      做自己喜欢做的,跟家人同等重要

  • 访问信息

    • 4,298
    • 2,920
    • 37,496
    • 118,823
    • 5,728,650
    • 1,925
    • 2024年3月5日
  • 功能

    • 登录
    • 文章RSS
    • 评论RSS
    • WordPress.org
  • 近期评论

    • 匿名发表在《我们农村吃过的野果》
    • 请看小说阅读网发表在《使用CSS + svg 实现中间镂空的图片遮罩效果,css遮罩》
    • 嘀嗒小说网,嘀嗒小说阅读网发表在《BI 开源工具介绍》
    • 瓜子小说网发表在《HTML 标签及在实际开发中的应用》
    • 爱趣发表在《WordPress固定链接设置技巧》
    • 全天电影网发表在《WordPress固定链接设置技巧》
    • java面试题收集 – 不静之心发表在《58到家数据库30条军规解读》
    • 不静之心发表在《CentOS6.4邮件配置三: 花生壳 + 自定义DNS解析 + Dovecot 配置收外网信件》
    • Evan发表在《CentOS6.4邮件配置三: 花生壳 + 自定义DNS解析 + Dovecot 配置收外网信件》
    • 不静之心发表在《spring+mybatis+jta/druid+atomikos 两种方式》

粤ICP备16057205号-1 , 潘永郑[ panyongzheng@163.com ]