uni-app 使用ucharts

1.首先引入ucharts配置文件,这是我项目放置的目录

image.png

ucharts官网:https://www.ucharts.cn/
ucharts 在线配置文档:https://demo.ucharts.cn/#/
ucharts 组件下载:https://ext.dcloud.net.cn/plugin?id=271
组件下载完后的目录
image.png

然后把components和js_sdk放在自己的项目中

2.页面布置

在<script></script>中引入charts组件
image.png

image.png
<template></template>中写入

image.png

其中这里写了type="history-DX",这个是自定义的图表名称,其对应引入的js_sdk中的
image.png

这个文件里写了history-DX的配置,这个对象里的具体配置就可以用ucharts 在线配置文档:https://demo.ucharts.cn/#/,调整好自己想要的效果后,直接复制到这里就可以了
image.png

记得在上面引入
image.png

3.如果js_sdk中的config-ucharts.js的一些配置是数据变量怎么办?

qiun-data-charts组件参数中opts支持自定义配置参数
组件基本API参数:https://gitee.com/uCharts/uCharts?utm_source=alading&utm_campaign=repo

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容