Y軸の異なるグラフの表示 | CURL DEVELOPER CENTER

【ご質問】
Y軸が異なる、3本のグラフを1つのプロットエリアに表示したいのですが、どうしたらよいのでしょうか。
X軸は同じ値を用いています。

【回答】
2つの異なるY軸であれば左側と右側に出すことが標準APIで可能です。
また、取りうる値の範囲が似た範囲であれば左右どちらかの軸を共有し3本以上のグラフを描くことは可能です。

以下のサンプルを参考にしてください。

{curl 6.0,7.0,8.0 applet}
{curl-file-attributes character-encoding = “shift-jis”}

{import * from CURL.GUI.CHARTS}

{let records:RecordSet =
    {RecordSet
        {RecordFields
            {RecordField “Region”, domain = String},
            {RecordField “M1”, caption = “January”, domain = int},
            {RecordField “M2”, caption = “February”, domain = int},
            {RecordField “M3”, caption = “March”, domain = int}
        },
        {RecordData Region = “North”, M1 = 100, M2 = 140, M3 = 130 },
        {RecordData Region = “East”, M1 = 110, M2 = 140, M3 = 170},
        {RecordData Region = “South”, M1 = 140, M2 = 100, M3 = 130},
        {RecordData Region = “West”, M1 = 160, M2 = 190, M3 = 140}
    }
}

{let left-group:ShapeGroup =
    {ShapeGroup
        color = FillPattern.black
    }
}

{let right-group:ShapeGroup =
    {ShapeGroup
        color = FillPattern.black
    }
}

{LayeredChart
    width = 15cm,
    height = 7cm,
    left-axis =
        {ChartAxis
            {ChartDataSeries records, “M1”},
            {ChartDataSeries records, “M2”},
            axis-group = left-group
        },
    right-axis =
        {ChartAxis
            {ChartDataSeries records, “M3”},
            axis-group = right-group
        },
    {LineLayer
        records,
        “M1”,
        “M2”,
        “M3”,
        x-axis-data =
            {ChartDataSeries records, “Region”},
        stroke-thickness = 2pt,
        ||わかりやすいように折れ線にポインターが入った場合は使用している軸を赤くする
        {on ChartLayoutChanged at layer:LineLayer do
            {layer.series-shapes[0].add-event-handler
                {on PointerEnter do
                    set left-group.color = FillPattern.red
                }
            }
            {layer.series-shapes[0].add-event-handler
                {on PointerLeave do
                    set left-group.color = FillPattern.black
                }
            }
            {layer.series-shapes[1].add-event-handler
                {on PointerEnter do
                    set left-group.color = FillPattern.red
                }
            }
            {layer.series-shapes[1].add-event-handler
                {on PointerLeave do
                    set left-group.color = FillPattern.black
                }
            }
             {layer.series-shapes[2].add-event-handler
                {on PointerEnter do
                    set right-group.color = FillPattern.red
                }
            }
            {layer.series-shapes[2].add-event-handler
                {on PointerLeave do
                    set right-group.color = FillPattern.black
                }
            }
        }
    }
}