<apex:chart>タグでドーナツグラフを表示する方法です。
Apexクラス・サンプル
public with sharing class Chart_PieSeries2 { public List<Data> getData() { return Chart_PieSeries2.getChartData(); } @RemoteAction public static List<Data> getRemoteData() { return Chart_PieSeries2.getChartData(); } public static List<Data> getChartData() { List<Data> data = new List<Data>(); data.add(new Data('Jan', 30)); data.add(new Data('Feb', 44)); data.add(new Data('Mar', 25)); data.add(new Data('Apr', 74)); data.add(new Data('May', 65)); data.add(new Data('Jun', 33)); data.add(new Data('Jul', 92)); data.add(new Data('Aug', 87)); data.add(new Data('Sep', 34)); data.add(new Data('Oct', 78)); data.add(new Data('Nov', 80)); data.add(new Data('Dec', 17)); return data; } public class Data { public String name { get; set; } public Integer data1 { get; set; } public Data(String name, Integer data1) { this.name = name; this.data1 = data1; } } }
Visualforceページ・サンプル
<apex:page controller="Chart_PieSeries2" title="Pie Chart"> <apex:chart data="{!data}" height="400" width="500"> <apex:legend position="left"/> <apex:pieSeries labelField="name" dataField="data1" donut="50"> <apex:chartLabel display="middle" orientation="vertical" font="bold 18px Helvetica"/> </apex:pieSeries> </apex:chart> </apex:page>
<apex:pieSeries>でグラフ種別を円グラフに指定しています。
<apex:pieSeries>内の「donut="50"」でドーナツ形式に表示できます。
<apex:chartLabel>でグラフ内にラベルを表示できます。
display="middle"はラベルの表示位置を指定できます。
orientationはよくわかりませんでした...。
わかったら追記する予定です。