博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
在Vue中使用highCharts绘制3d饼图
阅读量:6282 次
发布时间:2019-06-22

本文共 663 字,大约阅读时间需要 2 分钟。

highcharts是国外知名基于javascript的图表库。由于中文官网的vue中使用highcharts配置繁琐并且需要引入jquery作为依赖,所以弃用。

接下来,给各位伙伴简要的讲叙下highcharts在vue中的使用和配置方法。

首先使用 npm在你的项目中安装vue-highchartsnpm install vue-highcharts --save由于vue-highcharts依赖于highcharts,我们还需要安装后者npm install highcharts --save

安装完成后,进入项目main.js进行配置:

import highcharts from 'highcharts'import VueHighCharts from 'vue-highcharts'引入以上两项之后,因为我们需要使用3d图表,还需要引入:import highcharts3d from 'highcharts/highcharts-3d'调用3d图表:highcharts3d(highcharts)

OK,到此为止已经在vue中配置好highcharts,接下来根据API绘制一份3d饼图

新建一个饼图的组件:

在需要使用饼图的页面里配置option数据

看下效果。

clipboard.png

更多的配置说明可以到中文官网查看

欢迎讨论,需要git demo的可以留言,see you。

转载地址:http://iucpa.baihongyu.com/

你可能感兴趣的文章
解决了!我滴神哪!MarketPlace为什么手动下载安装部署提示invalid详解
查看>>
主成分分析原理及推导
查看>>
python中获取指定目录下所有文件名列表的程序
查看>>
HTML5的本地存储 LocalStorage
查看>>
safari和ie的时间解析(显示为NAN)
查看>>
基于 HTML5 WebGL 的挖掘机 3D 可视化应用
查看>>
Java工具创建密钥库,用于Unity 3D打包、签名、发布
查看>>
Oracle用户解锁
查看>>
MongoDB的使用
查看>>
C#开启异步 线程的四种方式
查看>>
XML解析
查看>>
2784: 【提高】小 X 与煎饼达人(flip)
查看>>
Linux 常用的压缩命令有 gzip 和 zip
查看>>
内存分段与分页
查看>>
第一个WindowService服务
查看>>
zookeeper的三种安装模式
查看>>
腾讯2014实习面经 —— 面试经过回忆
查看>>
MIT Scheme 使用 Edwin
查看>>
BZOJ1500:[NOI2005]维修数列——题解
查看>>
transactionscope报“此操作对该事务的状态无效”问题
查看>>