- GWT Highcharts 教程
- GWT Highcharts - 首頁
- GWT Highcharts - 概覽
- 環境設定
- 配置語法
- GWT Highcharts - 折線圖
- GWT Highcharts - 面積圖
- GWT Highcharts - 條形圖
- GWT Highcharts - 柱狀圖
- GWT Highcharts - 餅狀圖
- GWT Highcharts - 散點圖
- GWT Highcharts - 動態圖表
- GWT Highcharts - 組合
- GWT Highcharts - 3D 圖表
- GWT Highcharts - 地圖圖表
- GWT Highcharts 有用資源
- GWT Highcharts - 快速指南
- GWT Highcharts - 有用資源
- GWT Highcharts - 討論
GWT Highcharts - 散點圖
下面是一個基礎散點圖的示例。
我們已經看到了 Highcharts 配置語法 一章中用於繪製圖表中的配置。
以下是基礎散點圖的一個示例。
配置
讓我們現在看看其他配置/步驟。
系列
將圖表型別配置為基於散點。series.type 決定圖表中系列型別。在這裡,預設值為 "line"。
chart.addSeries(chart.createSeries()
.setName("Observations")
.setType(Type.SCATTER)
.setPoints(new Number[] {
1, 1.5, 2.8, 3.5, 3.9, 4.2
})
);
示例
HelloWorld.java
package com.tutorialspoint.client;
import org.moxieapps.gwt.highcharts.client.Chart;
import org.moxieapps.gwt.highcharts.client.Series.Type;
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");
chart.getXAxis()
.setMin(-0.5)
.setMax(5.5);
chart.getYAxis()
.setMin(0);
chart.addSeries(chart.createSeries()
.setName("Observations")
.setType(Type.SCATTER)
.setPoints(new Number[] {
1, 1.5, 2.8, 3.5, 3.9, 4.2
})
);
RootPanel.get().add(chart);
}
}
結果
驗證結果。
廣告