基本配置 opts
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| type | String | required | 图表类型，详见演示中的查看代码 |
| context | String | required | canvas的上下文，各平台方法不一致，详见【指南】中说明 |
| width | String | required | canvas的宽度，单位为px，如果canvas绑定的样式为rpx单位，这里需要转成px |
| height | String | required | canvas的高度，单位为px，如果canvas绑定的样式为rpx单位，这里需要转成px |
| categories | String | required | 图表数据集，部分图表类型不需要categories |
| series | String | required | 图表数据集，请按不同图表类型传入对应的标准数据详见下章节《数据配置》 |
| canvas2d | Boolean | false | canvas2d模式，用于解决小程序层级过高及拖拽卡顿问题，小程序平台开启后context及canvas的格式不同，详见【指南】中说明 |
| pixelRatio | Number | 1 | 设备像素比，解决开启canvas2d后画布模糊的问题 |
| animation | Boolean | true | 是否动画展示图表 |
| timing | String | 'easeOut' | 图表动画效果，可选值：'easeOut'由快到慢,'easeIn'由慢到快,'easeInOut'慢快慢,'linear'匀速 |
| duration | Number | 1000 | 动画展示时长，单位毫秒 |
| rotate | Boolean | false | 横屏模式 |
| rotateLock | Boolean | false | 横屏锁定模式，如果开启横屏模式后，图表交互每次都会旋转90度，请赋值true |
| background | Rgba | rgba(0,0,0,0) | 背景颜色，开启滚动条后请赋值 |
| color | Array | 主题颜色，16进制颜色格式 | |
| padding | Array | 画布填充边距，顺序为上右下左，例如[10,15,25,15] | |
| fontSize | Number | 13 | 全局默认字体大小 |
| fontColor | Hex | #666666 | 全局默认字体颜色，16进制颜色格式 |
| dataLabel | Boolean | true | 是否显示图表区域内数据点上方的数据文案 |
| dataPointShape | Boolean | true | 是否显示数据点的图形标识 |
| dataPointShapeType | String | 'solid' | 图形标识点显示类型，可选值：'solid'实心,'hollow'空心 |
| touchMoveLimit | Number | 60 | 图表拖拽时，每秒重新渲染的帧数（用于图表拖拽卡顿，可以降低js与视图层交互的次数，理论上24帧/秒就够用了） |
| enableScroll | Boolean | false | 开启滚动条，X轴配置里需要配置itemCount单屏幕数据点数量 |
| enableMarkLine | Boolean | false | 是否启用标记线功能，也可做为隐藏图表区域内的标记线的开关 |
| scrollPosition | String | current | 连续更新数据时，滚动条的位置。可选值："current"当前位置,"left"左对齐,"right"右对齐 |
组件Props
| 属性名 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| type | String | null | 是 | 图表类型，详见演示中的查看代码 |
| chartData | Object | 见说明 | 是 | 图表数据，类似 ECharts 的数据格式，详见演示中的查看代码 |
| localdata | Array | [] | 是 | 图表数据，类似 F2 的数据格式，详见演示中的查看代码 |
| opts | Object | {} | 否 | xCharts图表配置参数(option)。注：传入的opts属性会覆盖默认config-xCharts.js中的配置，只需传入与config-xCharts.js中属性不一致的【某一个属性】即可实现【同类型的图表显示不同的样式】。 |
| optsWatch | Boolean | true | 否 | 是否开启opts监听，即关闭后动态改变上面的opts参数将不会触发图表重绘 |
| eopts | Object | {} | 否 | 【仅uni-app】ECharts图表配置参数(option)，请参考【ECharts配置手册】传入eopts。注：1、传入的eopts会覆盖默认config-echarts.js中的配置，以实现同类型的图表显示不同的样式。2、eopts不能传递function，如果option配置参数需要function，请将function写在config-echarts.js中即可实现。 |
| loadingType | Number | 2 | 否 | 加载动画样式，0为不显示加载动画，赋值范围为1-5，共5种不同的样式。 |
| errorShow | Boolean | true | 否 | 是否在页面上显示错误提示，true为显示错误提示图片，false时会显示空白区域。 |
| errorReload | Boolean | true | 否 | 是否启用点击错误提示图表重新加载，true为允许点击重新加载，false为禁用点击重新加载事件。 |
| errorMessage | String | null | 否 | 自定义错误信息，强制显示错误图片及错误信息 |
| echartsH5 | Boolean | false | 否 | 【仅uni-app】是否在H5端使用ECharts引擎渲染图表 |
| directory | String | '/' | 否 | 【仅uni-app】使用echarts时，H5端发布的二级目录名称，假设二级目录为“h5”，请输入“/h5/” |
| echartsApp | Boolean | false | 否 | 【仅uni-app】是否在APP端使用ECharts引擎渲染图表 |
| canvasId | String | 见说明 | 否 | 默认生成32位随机字符串。如果指定canvasId，可方便后面调用指定图表实例，否则需要通过渲染完成事件获取自动生成随机的canvasId |
| canvas2d | Boolean | false | 否 | 是否开启canvas2d模式，用于解决小程序层级过高问题。注：开启canvas2d模式，必须要传入上面的canvasId【随机字符串，不能是数字开头！】不能“真机调试” 需要扫码预览 IDE显示不准确 |
| background | Rgba | rgba(0,0,0,0) | 否 | 背景颜色，默认透明rgba(0,0,0,0)，开启滚动条后需要赋值为父元素的背景色 |
| animation | Boolean | true | 否 | 是否开启图表动画效果 |
| inScrollView | Boolean | false | 否 | 图表组件是否在scroll-view中，如果在请传true，否则会出现点击事件坐标不准确的现象 |
| pageScrollTop | Number | 0 | 否 | 如果图表组件是在scroll-view中，并且整个页面还存在滚动条，这个值应为绑定为页面滚动条滚动的距离，否则会出现点击事件坐标不准确的现象 |
| reshow | Boolean | false | 否 | 强制重新渲染属性，如果图表组件父级用v-show包裹，初始化的时候会获取不到元素的宽高值，导致渲染失败，此时需要把父元素的v-show方法复制到reshow中，组件监听到reshow值变化并且为true的时候会强制重新渲染，不能直接为ture，需要动态改变才能监听到 |
| reload | Boolean | false | 否 | 强制重新加载属性，与上面的reshow区别在于：1、reload会重新显示loading动画；2、如果组件绑定了uniCloud数据查询，通过reload会重新执行SQL语句查询，重新请求网络。而reshow则不会显示loading动画，只是应用现有的chartData数据进行重新渲染。不能直接为ture，需要动态改变才能监听到 |
| disableScroll | Boolean | false | 否 | 当在canvas中移动时，且有绑定手势事件时，禁止屏幕滚动以及下拉刷新（赋值为true时，在图表区域内无法拖动页面滚动） |
| tooltipShow | Boolean | true | 否 | 点击或者鼠标经过图表时，是否显示tooltip提示窗，默认显示 |