echarts
关注
分享
扫一扫
文章平均质量分 75
Akimoto Hiroshi
这个作者很懒，什么都没留下…
展开
-
Echarts样式和高亮设置
1.样式修改以饼图为例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&原创 2021-10-07 11:12:01 · 4273 阅读 · 1 评论 -
Echarts主题和调色盘以及颜色渐变
默认主题：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Echa.原创 2021-10-07 10:53:54 · 451 阅读 · 0 评论 -
Echarts仪表盘
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>仪表盘</ti.原创 2021-10-06 22:54:23 · 222 阅读 · 0 评论 -
Echarts雷达图和常用配置
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>雷达图</ti.原创 2021-10-06 22:28:04 · 568 阅读 · 0 评论 -
Echarts地图和散点图结合使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>地图-不同城市空气质.原创 2021-10-06 21:35:45 · 1083 阅读 · 0 评论 -
Echarts空气质量地图效果
我们要先把空气质量数据和地图数据结合起来：地图数据有name这个属性我们的不同城市空气质量也有name这个属性，这两个属性是一样的，都叫name，所以我们可以把他们关联起来：var airData = [ { name: '北京', value: 39.92 }, { name: '天津', value: 39.13 }, { name: '上海', value: 31.22 }, { name: '重庆', value: 66 }, {原创 2021-10-06 17:05:43 · 3215 阅读 · 2 评论 -
Echarts 地图基本使用
1.基本使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>地图&.原创 2021-10-06 16:26:29 · 3489 阅读 · 0 评论 -
Echarts饼图常用效果
基本实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>饼图<.原创 2021-10-03 22:28:38 · 1495 阅读 · 0 评论 -
Echarts 直角坐标系常用配置
grid<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>直角坐标.原创 2021-10-03 12:36:28 · 386 阅读 · 0 评论 -
Echarts 散点图常用效果
气泡大小控制<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>模板&l原创 2021-10-03 10:40:58 · 596 阅读 · 0 评论 -
Echarts 散点图基本使用
上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>模板<.原创 2021-10-03 09:45:59 · 262 阅读 · 0 评论 -
Echarts柱状图 折线图常用配置之区域颜色和渐变
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>折线图</tit原创 2021-10-02 14:01:21 · 4480 阅读 · 0 评论 -
Echarts 图例legend基本配置
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>柱状图的基本实现和常.原创 2021-10-02 11:13:54 · 1958 阅读 · 0 评论 -
Echarts tooltip配置
echarts配置，和title同一级别，配置tooltip:1.触发时机triggertooltip: { trigger: 'item'}如果把item改为axis:tooltip: { trigger: 'axis'}2.触发条件triggerOn比如设置鼠标点击时候才触发tooltip: { trigger: 'item', triggerOn: 'click'}3.提示内容格式化formattertooltip: { trigger: 'ite原创 2021-10-02 10:32:06 · 4827 阅读 · 0 评论 -
Echarts学习笔记一： 柱状图基础 最大最小值 平均值 显示数值
Echarts常用图表1.柱状图先上代码：<!-- 这里通过cdn引入echarts--><script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.0.2/echarts.common.min.js"></script><body> <div style="width: 600px; height: 400px"></div> <script>原创 2021-03-31 22:24:07 · 4889 阅读 · 3 评论