echarts
文章平均质量分 51
余温无痕
这个人很懒
展开
-
小程序 echarts进阶篇(四),手指缩放与放大
只需要在你的option配置添加如下属性:legend: { // 显示图例组件 show: legendDatta ? true : false, data: legendDatta, bottom: '0', z: 100 }, // 重点,添加这个就可以了 dataZoom: { type: 'inside' }, xAxis: { type: 'category', .原创 2021-07-28 16:03:58 · 6065 阅读 · 4 评论 -
小程序 echarts进阶篇(三),减少echarts的体积
如果是从官网下载下来的echarts会有900多KB的大小,小程序开发不采用分包,然后你那个图片又多,很容易就超出小程序限制的2M大小,所以我们可以借用官网的自定义构建来自定义需求,echarts在线构建选择好配置之后点击下载,如果勾选了代码压缩就会下载echarts.min.js,没有勾选的话是echarts.js,建议正式发布版是下载压缩过后的,要不然文件还是会很大。2、下载压缩版好后,把echarts.min.js修改成echarts.js,然后覆盖你项目中的echar..原创 2021-07-28 11:52:13 · 2927 阅读 · 0 评论 -
小程序 echarts图表开发项目篇(二)
在我们项目使用的时候,肯定不能像上篇文章那样使用,因为我们得获取到后台数据,然后渲染出来,这时候我们得把option配置提取出来,具体的操作如下:1、JS代码const app = getApp();import * as echarts from '../../ec-canvas/echarts';var chartLine; // 这是第一个图表var chartLineMore; // 这是第二个图表function getOption(titles, xData, legendD原创 2021-07-28 11:13:14 · 765 阅读 · 0 评论 -
小程序 echarts图表开发基础篇(一)
1、首先,下载 GitHub 上的ecomfe/echarts-for-weixin项目。下载好后把这个文件夹保存到你的项目中,2、初步尝试,这块代码我是直接引用官网上的代码import * as echarts from '../../ec-canvas/echarts';const app = getApp();function initChart(canvas, width, height, dpr) { const chart = echarts.init(c...原创 2021-07-28 10:51:10 · 1551 阅读 · 0 评论 -
echarts 放大与缩放的功能
// 内置型数据区域缩放组件(dataZoomInside):内置于坐标系中,使用户可以在坐标系上通过鼠标拖拽、鼠标滚轮、手指滑动(触屏上)来缩放或漫游坐标系。// 滑动条型数据区域缩放组件(dataZoomSlider):有单独的滑动条,用户在滑动条上进行缩放或漫游。function getOption(titles, xData, legendDatta, series, top) { var option = { title: { text: titles, .原创 2021-07-28 10:35:44 · 46683 阅读 · 11 评论