スプライングラフ

スプライングラフには、複数のデータセットが含まれています。スプライングラフは、データのポイントを滑らかな曲線で接続します。各データ系列（addColumns()メソッドで作成）は、IDと値のセットを受け取るMultiValueColumnオブジェクトの新しいインスタンスで定義されます。次の手順に従って、スプライングラフを使用するようにポートレットを構成します。

Chart taglibをSplineChartConfigクラスとMultiValueColumnクラスとともにバンドルのinit.jspファイルにインポートします。

<%@ taglib prefix="chart" uri="http://liferay.com/tld/chart" %>
<%@ page import="com.liferay.frontend.taglib.chart.model.point.spline.SplineChartConfig" %>
<%@ page import="com.liferay.frontend.taglib.chart.model.MultiValueColumn" %>

次のJavaスクリプトレットをview.jspの先頭に追加します。

<%
SplineChartConfig _splineChartConfig = new SplineChartConfig();

_splineChartConfig.addColumns(
  new MultiValueColumn("data1", 100, 20, 30),
  new MultiValueColumn("data2", 20, 70, 100));
}
%>

<chart> taglibをview.jspに追加し、config属性の値として_splineChartConfigを渡します。
```
<chart:spline
  config="<%= _splineChartConfig %>"
/>
```

スプライングラフは、データのポイントを滑らかな曲線で接続します。

必要に応じて、エリアスプライングラフを使用することもできます。エリアスプライングラフは、スプライン曲線の下のエリアを強調表示します。

<chart:area-spline
  config="<%= _splineChartConfig %>"
/>

エリアスプライングラフは、スプライン曲線の下のエリアを強調表示します。

これで、アプリのスプライングラフを作成する方法がわかりました。

スプライングラフ

関連トピック

Not finding what you're looking for?