Fusion图表在Donut Chart中显示百分比为centerLabel

时间:2017-04-26 19:17:47

标签: jquery fusioncharts

使用Fusion Charts脚本,我可以轻松地将图表标签显示为百分比。但是,我需要在标签上显示值,并在圆环图的中心显示百分比。

Fusion Charts API似乎不包含此选项。似乎$ value和$ label是唯一可用的变量。

是否可以这样做?

如果看起来我错过了一些明显的东西,这里有一些jquery:

$.each(jsonDataPoints, function (index, obj) {
        var hoverText = obj.label + " (" + obj.value + ")";
        //obj.toolText = hoverText; //This sets the text to display when a pie chart is hovered.
        //obj.displayValue = hoverText; //This sets the chart labels.
        obj.displayValue = obj.value; //This sets the chart labels.
        obj.centerLabel = obj.percentValue;//percentValue is not an object. Just a guess
    });

    var doughnutChart = new FusionCharts({
        type: 'doughnut2D',
        renderAt: containerId,
        registerWithJS: '1',
        dataFormat: 'json',
        "width": "100%",
        "height": "100%",
        dataSource: {
            "chart": {
                "paletteColors": "#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000",
                "bgColor": "#ffffff",
                "showBorder": "0",
                "use3DLighting": "0",
                "showShadow": "0",
                "enableSmartLabels": "0",
                "startingAngle": "310",
                "showLabels": "0",
                "showPercentValues": "1",
                "showLegend": "1",
                "legendShadow": "0",
                "legendBorderAlpha": "0",
                "defaultCenterLabel": "...",
                "centerLabel": "$value",
                "centerLabelBold": "1",
                "showTooltip": "1",
                "decimals": "0",
                "captionFontSize": "14",
                "subcaptionFontSize": "14",
                "subcaptionFontBold": "0",
                "useDataPlotColorForLabels": "1",
                "labelDistance": "-20",
                "baseFontSize": "13",
            },
            "data": jsonDataPoints
        }
    });

    doughnutChart.render();

1 个答案:

答案 0 :(得分:0)

我通过扫描fusioncharts.js源代码偶然发现了答案。值为$ percentValue。

所需要的只是设置" centerLabel" :" $ percentValue

\actsymb['subscripLeft']['superscriptL']{<middle>}{'subscriptR'}{'superscriptR'}

此值设置在&#34; _parseValues&#34; fusioncharts.js中的函数