微信小程序使用echarts实现左右双Y轴，动态获取数据，生成折线图

最初用的是wxcharts，但是发现左右双Y轴的效果无法实现，所以改成了echarts

为了实现这一效果，需要以下步骤：

(1)去github下载插件，放到自己的项目中

只需将名为ec-canvas的文件夹放入您自己的项目中。

像这样：

(2)分别编写小程序的四个文件

echart . JSON { ' USing ComPonents ' : { ' EC-canvas ' : '././ec-canvas/ec-canvas' }}

！-echart . wxml-view class=' container ' EC-canvas id=' myechart ' canvas-id=' graph ' EC=' { { EC } } '/EC-canvas/view

echart . wxss . container { margin : 0；padd : 0 }

echart.js

在这里一步一步写：

步骤1:导入echarts插件

导入*作为来自的echarts '././EC-canvas/echart '；步骤2:在页面外编写的方法

函数echart(图表，leftData，rightData) {//leftData是坐标系左边y轴，右数据是右边y轴定义变量选项={ //网格grid: { bottom: 80，show: true，//containLabel: true }，//图例图例： {数据： [{名称： '左数据'，textStyle: { //设置颜色color: '#6076FF '，fontSize: '14 '，} }，{ name: 'rightData '，text style : { color : ' # ffc 560 '，fontSize: '14 '，} ]，x: 'left '，bottom: 15，left: 30 }，//x轴xAxis: { type: 'category '，boundaryGap: false，disableGrid: true，//绘制X网格data: [“”、“”、“”、“”、“”、“”、“”]，splitLine: { show: true， //改变轴线颜色lineStyle: { //使用深浅的间隔色color: ['#DDDDDD'] } }，//去掉刻度axisTick: { show: false }，//去掉x轴线axisLine: { show: false }，}，//y轴yAxis: [{ name: 'mph '，type: 'value '，min: 0，//max: 40，//y标轴名称的文字样式名称text style : { color : ' # ffc 560 ' }，//网格线splitLine: { show: true，linestyle : { color :[' # DDDDDD ']} }，//去掉刻度axisTick: { show: false }，//去掉y轴线axisLine: { show: false }，}，{ name: 'g '，type: 'value '，//max: 4，min: 0，name text style : { color : ' # 6076 ff ' }， //去掉刻度axisTick: { show: false }，//去掉y轴线axisLine: { show: false }，} ]，系列：[{ name : ' left data '，type: 'line '，animation: true，//动画效果符号： "无",//折线区域区域样式： { //渐变颜色color: { type: 'linear '，x: 0，y: 0，x2: 0，y2: 1，colorstop 3360[{ offset : 0 0，color: '#6076FF' //0%处的颜色}，{ offset: 1，color: 'rgba(96，118，255，0.1)' //100%处的颜色}]，global: false，//缺省为false }、}、//折线宽度线型： {宽度： 2 },颜色： '#6076FF '，data: leftData //后台传过来的动态数据//设置固定的数据//data: [ //23，30，20，23，30，26，20，25，25/]}，{ name: 'rightData '，type: 'line '，yAxisIndex: 1，animation: true，symbol: 'none '，area tyles : { color 3: { type 333: ' linear '，x3:y 3:处的颜色}，{ offset: 1，color: 'rgba(255，197，96，0.3)' //100%处的颜色}]，global: false，//缺省为false }，}，lineStyle: { width: 2 }，color: '#FFC560 '，data: rightData，//后台传过来的动态数据//设置固定的数据//data: [ //2，1，0.5，0.9，2，1.0，0.6，2，0.5/]}]} }第三步：写在页里的方法，(包括onLoad()，初始化)

/** * 页面的初始数据*/数据： { EC : { LazyLoad : true//初始化加载}}，onLoad:函数（选项){让那个=这个；这个。一个组件=这个。select component(“#我的图表”)；让url='