<apex:chart>タグで棒グラフと折れ線グラフを一緒に表示する方法です。
Apexクラス・サンプル
public class Chart_ChartTips { public List<Data> getData() { return Chart_ChartTips.getChartData(); } @RemoteAction public static List<Data> getRemoteData() { return Chart_ChartTips.getChartData(); } public static List<Data> getChartData() { List<Data> data = new List<Data>(); data.add(new Data('Jan', 30, 90, 55)); data.add(new Data('Feb', 44, 15, 65)); data.add(new Data('Mar', 25, 32, 75)); data.add(new Data('Apr', 74, 28, 85)); data.add(new Data('May', 65, 51, 95)); data.add(new Data('Jun', 33, 45, 99)); data.add(new Data('Jul', 92, 82, 30)); data.add(new Data('Aug', 87, 73, 45)); data.add(new Data('Sep', 34, 65, 55)); data.add(new Data('Oct', 78, 66, 56)); data.add(new Data('Nov', 80, 67, 53)); data.add(new Data('Dec', 17, 70, 70)); return data; } public class Data { public String name { get; set; } public Integer data1 { get; set; } public Integer data2 { get; set; } public Integer data3 { get; set; } public Data(String name, Integer data1, Integer data2, Integer data3) { this.name = name; this.data1 = data1; this.data2 = data2; this.data3 = data3; } } }
Visualforceページ・サンプル
<apex:page controller="ChartController"> <apex:chart height="400" width="700" data="{!data}"> <apex:legend position="right"/> <apex:axis type="Numeric" position="left" fields="data1" title="Opportunities Closed" grid="true"/> <apex:axis type="Numeric" position="right" fields="data3" title="Revenue (millions)"/> <apex:axis type="Category" position="bottom" fields="name" title="Month of the Year"> <apex:chartLabel rotate="315"/> </apex:axis> <apex:barSeries title="Monthly Sales" orientation="vertical" axis="right" xField="name" yField="data3"> <apex:chartTips height="20" width="120"/> </apex:barSeries> <apex:lineSeries title="Closed-Won" axis="left" xField="name" yField="data1" fill="true" markerType="cross" markerSize="4" markerFill="#FF0000"/> <apex:lineSeries title="Closed-Lost" axis="left" xField="name" yField="data2" markerType="circle" markerSize="4" markerFill="#8E35EF"/> </apex:chart> </apex:page>
<chart>内に<apex:barSeries>や<apex:lineSeries>などを一緒に宣言することで
様々なグラフを一緒に表示できるようです。
他にも組み合わせがあるかもしれないです。