2017-04-26 91 views
0

使用Fusion Charts腳本,我可以輕鬆地以百分比顯示圖表標籤。但是,我需要在標籤上顯示值,並在圓環圖的中心顯示百分比。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(); 

回答

0

我偶然發現了這個問題的答案將通過fusioncharts.js源代碼掃描。值是$ percentValue。

所有這一切都需要的是設置 「centerLabel」:「$ PERCENTVALUE

"centerLabel" : "$percentValue 

該值設置裏面的 「_parseValues」 功能fusioncharts.js