ECharts教程
-
ECharts – visualMap概述
visualMap概述 visualMap 是视觉映射组件，用于进行『视觉编码』，也就是将数据映射到视觉元素（视觉通道）。 视觉元素可以是： symbol: 图元的图形类别。 s……田田 2021年7月26日
-
ECharts – visualMap代码实例及对应注释
visualMap代码实例及对应注释 *下列代码可作为模板修改后使用 visualMap=[ //视觉映射组件，用于进行『视觉编码』，也就是将数据映射到视觉元素。视觉元素可……yiyan 2021年7月26日
-
ECharts – 图表类型概述
概述 图表类型通过每个系列的type 决定。 series: [{ name: '销量', // 系列名称 type: 'bar', // 系列图表类型 data: [5, 20, 36, 10, 10, 20] // 系列……牛青 2021年7月26日
-
ECharts – 饼状图
概述 饼图主要用于表现不同类目的数据在总和中的占比。每个的弧度表示数据数量的比例。 饼状图的实现 饼状图的实现十分简单。饼图主要是通过扇形的弧度表现…… -
ECharts – 饼状图图代码实例及其注释详解
mytextStyle={ color:"#333", //文字颜色 fontStyle:"normal", //italic斜体 oblique倾斜 fontWeight:"normal", //文字粗细bol…… -
ECharts – 南丁格尔图
上一篇教程我们讲了饼状图，我们可以在已经完成的饼状图的基础上通过设置饼状图的参数 roseType为 ‘angle’ 把饼图显示成南丁格尔图。 roseType 我们先来看看这……bigao 2021年7月26日
-
ECharts – 柱状/条形图
概述 柱状/条形图 通过 柱形的高度/条形的宽度 来表现数据的大小，用于有至少一个类目轴或时间轴的直角坐标系上。 实例： 实现一个简单的柱状图 我们之需要设……小杜 2021年7月26日
-
ECharts – 堆叠柱状图
上一篇教程我们讲了如何实现一个最简单的柱状图，这个柱状图只有一列数据（销量）： 如下图所示： 而在现实生活中我们常常会遇到具有多列数据的情况： 如销量…… -
ECharts – 横向柱状图与纵向柱状图
生活中常见的柱状图，常常有横向的和纵向的两种（如下两图所示）。我们在ECharts中该如何实现呢？ 纵向： 横向： 柱状图的横向与纵向的设置与x轴和y轴的设……喔28 2021年7月26日
-
ECharts – echarts改变柱状图每个柱子的颜色
echarts改变柱状图每个柱子的颜色 在实际使用ECharts时，我们常常需要使不同的数据用不的颜色来加以区分，那么我们该如何设置呢？ 实例 我们以树懒课堂7月访问…… -
ECharts – 极坐标系下的堆叠柱状图（多重环形图）
极坐标系下的堆叠柱状图（多重环形图） 柱状图与极坐标系结合会是什么样的呢？ 效果图如下： 如何配置 坐标系配置： polar 极坐标属性配置： polar: {}, …… -
ECharts – 柱形图代码实例及其注释详解
柱形图代码实例及其注释详解 mytextStyle={ color:"#333", //文字颜色 fontStyle:"normal", //italic斜体 oblique倾斜 fontWeight:"no……中天 2021年7月26日
-
ECharts – 雷达图
概述 雷达图是通过ECharts的雷达图坐标系组件实现的。该组件等同 ECharts 2 中的 polar 组件。因为 3 中的 polar 被重构为标准的极坐标组件，为避免混淆，雷…… -
ECharts – 雷达图代码实例
雷达图代码实例及其注释详解 实例：树懒课堂七月开销及预算 雷达图 效果图： 完整代码： <!DOCTYPE html> <html> <head> <meta charset…… -
ECharts – 雷达图及其坐标系实例及注释
雷达坐标系： 内涵雷达图坐标系所有属性，使用方法见代码后对应注释 mytextStyle={ color:"#333", //文字颜色 fontStyle:"normal", ……老王 2021年7月26日
-
ECharts – 基本折线图
基本折线图 基本折线图的设置十分简单，我们只需设置好坐标系及series即可。 以一个基本折线图为例： 代码如下： <!DOCTYPE html> <html> <h……嘿哈 2021年7月25日
-
ECharts – 基本面积图
基本面积图 在实际使用过程中，基本折线图有时会无法满足我们的需求，如：为了使数据更加易于区别等，我们需要填充折线图的区域。这时，我们就需要使用基本面…… -
ECharts – 平滑折线图
平滑折线图 在实际需求中我们有时不需要“折线”，而是需要平滑的曲线。这时，我们的平滑曲线图应运而生。 平滑曲线图和基本面积图一样，也是是在基本折线图上…… -
ECharts – 折线图代码实例及注释
折线图代码实例及注释 内涵折线图所有属性，使用方法见代码后对应注释 mytextStyle={ color:"#333", //文字颜色 fontStyle:"normal", …… -
ECharts – 旭日图
ECharts 旭日图 概述 旭日图（Sunburst）由多层的环形图组成，在数据结构上，内圈是外圈的父节点。因此，它既能像饼图一样表现局部和整体的占比，又能像矩形树…… -
-
ECharts – 日历图
概述 在 Apache ECharts (incubating)TM 中新增了日历坐标系，如何快速写出一个日历图呢？ 日历图可以与多种图表结合，如散点图、热力图、饼状图等。 实例 …… -
ECharts – 散点图
基本散点图 最基本的散点图设置十分简单，我们只需设置好x轴、y轴和图表需要的二维数据即可。 即我们只需设置xAxis、yAxis和series即可 在基本散点图中xAxis…… -
ECharts – 主题
颜色主题 概述 ECharts 可以通过主题设置来改变图形元素或者文字的颜色、明暗、大小等。 使用方式如下: 在使用echarts. init创建一个 ECharts 实例时，在第…… -
ECharts – 调色盘
调色盘 概述 调色盘可以在 option 中设置。 调色盘给定了一组颜色，图形、系列会自动从其中选择颜色。 可以设置全局的调色盘，也可以设置系列自己专属的调色……