javascript Morris js 以百分比格式显示值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23717001/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Morris js Display values in percentage format
提问by Aaron Ullal
I am drawing some charts for a school project pulling data from a mysql database. Here is what I've done so far:
我正在为一个从 mysql 数据库中提取数据的学校项目绘制一些图表。这是我到目前为止所做的:
DONUT CHARTS
甜甜圈图
JS CODE:
JS代码:
Morris.Donut({
element: 'donut-quanti',
data: [
{label: "USE FACEBOOK", value: <?php echo $fb_yes;?> },
{label: "DON'T USE FACEBOOK", value: <?php echo $fb_no;?>}
]
});
BAR CHARTS
条形图
JS CODE:
JS代码:
Morris.Bar({
element: 'bars-status',
data: [
{x:'RARELY',a:<?php echo $fb_rar;?>},
{x:'EV WEEK.',a:<?php echo $fb_ew;?>},
{x:'EV DAY',a:<?php echo $fb_ed;?>},
{x:'MULT. TIMES PER DAY',a:<?php echo $fb_mtd;?>}
],
xkey:'x',
ykeys:'a',
labels:['TOTAL']
});
Is there a way to display the numeric values (rapresented by the php variables $fb_*) IN PERCENTAGE FORMAT from javascript code(not echoing variable/total * 100 in php ) ?
有没有办法从 javascript 代码中以百分比格式显示数值(由 php 变量 $fb_* 表示) (在 php 中不回显变量/总计 * 100)?
回答by chiliNUT
For the donut you need to use the formatter
parameter
对于甜甜圈,您需要使用formatter
参数
formatter: function (value, data) { return (value/total *100) + '%'; }
See: http://morrisjs.github.io/morris.js/donuts.html
见:http: //morrisjs.github.io/morris.js/donuts.html
For the bar you need to use hover callback
对于栏,您需要使用悬停回调
hoverCallback: function (index, options, content) {
var row = options.data[index];
//assumes you have already calculated the total of your own dataset
return (value/total *100)+'%';
}
回答by jaykwapong
To add the percentage symbol, please use this property. I did not find this in the docs but it works perfectly. postUnits: ["%"]
要添加百分比符号,请使用此属性。我没有在文档中找到这个,但它工作得很好。帖子单位:["%"]
回答by Kishore Thangapandi
donutChartOptions = {
resize: true,
colors: ["#8e54e9", "#4776e6"],
formatter: function (value) { return (value) + '%'; }
}