javascript - Plotly.js 饼图值格式

标签 javascript pie-chart plotly

我正在使用 Plotly.js 创建一些饼图,但我不知道如何设置值格式。如果我的号码是 19.231,我得到 19.2。我想要 19.2310,4 位精度。我的数据和布局如下:

var data = [{
    values: values,
    labels: labels,
    type: 'pie',
    marker: {
        colors: colors
    },
    textfont: {
        family: 'Helvetica, sans-serif',
        size: 48,
        color: '#000'
    }
}];
var layout = {
    height: 1350,
    width: 1500,
    title: title,
    titlefont: {
        family: 'Helvetica, sans-serif',
        size: 58,
        color: '#000'
    },
    legend: {
        x: 1.1,
        y: 0.5,
        size: 40,
        font: {
            family: 'Helvetica, sans-serif',
            size: 48,
            color: '#000'
        }
    }
};

最佳答案

据我所知,您不能直接在 Plotly 中执行此操作,但您可以添加 text具有所需精度的值,并将 textinfo 设置为 text

var values = [Math.random(), Math.random(), Math.random()];
var sum = values.reduce(function(pv, cv) { return pv + cv; }, 0);
var digits = 4;
var rounded_values = [];

for (var i = 0; i < values.length; i += 1) {
	rounded_values.push(Math.round(values[i]/sum * 100 * 10**digits) / 10**digits + '%');
}

var myPlot = document.getElementById('myPlot');
var data = [{
    values: values,
    type: 'pie',
    text: rounded_values,
	textinfo: 'text'
}];
Plotly.plot(myPlot, data);
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id="myPlot"></div>

关于javascript - Plotly.js 饼图值格式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43516070/

相关文章:

javascript - 将参数传递给无状态功能组件中的事件函数

javascript - 合并/组合两个对象

javascript - d3饼图的不同弧形显示相同的颜色

r - 为 R : Remove the k that apears on the y axis when the dataset contains numbers larger than 1000 作图

javascript - 在页面加载时隐藏 div 类

javascript - 如何在滚动时更改字体大小

chart.js - 如何隐藏 Chart.js 饼图中的部分

r - 在 R 中的饼图上添加百分比标签

R - plotly - 结合气泡图和等值线图

javascript - plotly js去除标题和标题区域