Gwt-highcharts-combinations-scatter

回帰線を使用した散布図

以下は、回帰直線を使用した散布図の例です。

link：/gwt_highcharts/gwt_highcharts_configuration_syntax [Highcharts構成構文]の章で、チャートを描画するために使用される構成をすでに確認しました。

回帰線を使用した散布図の例を以下に示します。

構成

ここで、追加の構成/実行された手順を見てみましょう。

シリーズ

散布図ベースのチャートタイプを構成します。 series.type は、チャートのシリーズタイプを決定します。 ここで、デフォルト値は「line」です。

chart.addSeries(chart.createSeries()
   .setType(Type.SCATTER)
);

例

*_HelloWorld.java_*

package com.finddevguides.client;

import org.moxieapps.gwt.highcharts.client.Chart;
import org.moxieapps.gwt.highcharts.client.Series;
import org.moxieapps.gwt.highcharts.client.plotOptions.LinePlotOptions;
import org.moxieapps.gwt.highcharts.client.plotOptions.Marker;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class HelloWorld implements EntryPoint {
   public void onModuleLoad() {
      final Chart chart = new Chart()
         .setChartTitleText("Scatter plot with regression line");

      chart.getXAxis()
         .setMin(-0.5)
         .setMax(5.5);

      chart.getYAxis()
         .setMin(0);

      chart.addSeries(chart.createSeries()
         .setName("Regression Line")
         .setType(Series.Type.LINE)
         .setPlotOptions(new LinePlotOptions()
            .setMarker(new Marker()
               .setEnabled(false)
            )
            .setHoverStateLineWidth(0)
            .setEnableMouseTracking(false)
         )
         .setPoints(new Number[][]{
            {0, 1.11}, {5, 4.51}
         })
      );

      chart.addSeries(chart.createSeries()
         .setName("Observations")
         .setType(Series.Type.SCATTER)
         .setPoints(new Number[] {
            1, 1.5, 2.8, 3.5, 3.9, 4.2
         })
      );
      RootPanel.get().add(chart);
   }
}

結果

結果を確認します。

回帰線付き散布図