随笔分类 - Echarts
摘要:3.7 雷达图 3.7.1 实现步骤 ECharts最基本的代码结构 引入js文件 DOM容器 初始化对象 设置option 定义各个维度的最大值 indicator 准备具体产品的数据 图表类型 在 series 下设置 type: 'radar' <!DOCTYPE html> <html la
阅读全文
摘要:3.5 饼图 3.5.1 实现步骤 ECharts最基本的代码结构 引入js文件 DOM容器 初始化对象 设置option 数据准备 图标类型 在 series 设置 type:'pie' <!DOCTYPE html> <html lang="en"> <head> <meta charset="
阅读全文
摘要:3.4 直角坐标系常用配置 直角坐标系图标:柱状图 折线图 散点图 3.4.1 网格grid grid是用来控制直角坐标系的布局和大小 x轴和y轴就是在grid基础上进行绘制的 show borderWidth 边框宽度 borderColor 边框颜色 left top width height
阅读全文
摘要:3.3 散点图 散点图可以帮助我们推断出变量间的相关性。 比如身高和体重的关系。 3.3.1 实现步骤 Echarts最基本的代码结构 引入js文件 DOM容器 初始化对象 设置option x轴和y轴的数据:二维数组 图标类型 在series下设置 type:scatter xAxis和yAxis
阅读全文
摘要:3.2折线图 实现步骤 Echarts最基本的代码结构 引入js文件 DOM容器 初始化对象 设置option 设置x轴、y轴数据 图表类型:在series下设置 type: 'line' 3.2.1 常见效果 标记:最大值 最小值 平均值 标注区间 线条控制:平滑 风格 smooth lineSt
阅读全文
摘要:3.1 柱状图 实现步骤 Echarts最基本的代码结构 引入js文件 DOM容器 初始化对象 设置option x轴数据 y轴数据 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport
阅读全文
摘要:1.1 ECharts的介绍 ECharts是一个使用JavaScript实现的开源可视化库,兼容性强,底层依赖矢量图形库ZRender,提供直观,交互丰富,可高度个性定制的数据可视化图表。 1.2 ECharts的特点 丰富的可视化类型 多种数据格式的支持 流数据的支持 流数据的动态渲染 增量渲染
阅读全文