首页 > 代码库 > 绘制HightCharts饼状图
绘制HightCharts饼状图
1.添加引用highcharts.js和exporting.js
2.前台代码如下,相关参数可以从后台配置,支持load加载
$(function () { $(‘#ResInfoView‘).highcharts({ //图表展示容器,与div的id保持一致 chart: { type: ‘pie‘ //指定图表的类型,默认是折线图(line) }, title: { text: ‘资源总容量$!totalSize‘ //指定图表标题 }, tooltip: { //2表示精确到小数点后2位 formatter: function () { return ‘<b>‘ + this.point.name + ‘</b>: ‘ + Highcharts.numberFormat(this.percentage, 2) + ‘ %‘; } }, series: [{//设置每小个饼图的颜色、名称、百分比 type: ‘pie‘, name: null, data: [ {name:‘图片$!PicSize‘,color:‘#3DA9FF‘,y:$!PicRate}, { name: ‘文档$!DocSize‘, color: ‘#008FE0‘, y: $!DocRate }, { name: ‘视频$!VideoSize‘, color: ‘#00639B‘, y: $!VideoRate }, {name:‘其他$!OtherSize‘,color:‘#CBECFF‘,y:$!OtherRate} ] }] }); });
绘制HightCharts饼状图
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。