Gráficos de Google de GWT - CandleStick básico
A continuación se muestra un ejemplo de un gráfico básico de CandleStick.
Ya hemos visto las configuraciones utilizadas para dibujar un gráfico en el capítulo Sintaxis de configuración de Google Charts . Ahora, veamos un ejemplo de un gráfico CandleStick.
Configuraciones
Hemos usado CandlestickChart clase para mostrar un gráfico básico de CandleStick.
// Candlestick chart
CandlestickChart chart = new CandlestickChart();
Ejemplo
HelloWorld.java
package com.tutorialspoint.client;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
import com.googlecode.gwt.charts.client.ChartLoader;
import com.googlecode.gwt.charts.client.ChartPackage;
import com.googlecode.gwt.charts.client.ColumnType;
import com.googlecode.gwt.charts.client.DataTable;
import com.googlecode.gwt.charts.client.corechart.CandlestickChart;
import com.googlecode.gwt.charts.client.corechart.CandlestickChartOptions;
import com.googlecode.gwt.charts.client.options.BackgroundColor;
import com.googlecode.gwt.charts.client.options.Legend;
import com.googlecode.gwt.charts.client.options.LegendPosition;
public class HelloWorld implements EntryPoint {
private CandlestickChart chart;
private void initialize() {
ChartLoader chartLoader = new ChartLoader(ChartPackage.CORECHART);
chartLoader.loadApi(new Runnable() {
public void run() {
// Create and attach the chart
chart = new CandlestickChart();
RootPanel.get().add(chart);
draw();
}
});
}
private void draw() {
DataTable dataTable = DataTable.create();
dataTable.addColumn(ColumnType.STRING, "Date");
dataTable.addColumn(ColumnType.NUMBER, "A");
dataTable.addColumn(ColumnType.NUMBER, "B");
dataTable.addColumn(ColumnType.NUMBER, "C");
dataTable.addColumn(ColumnType.NUMBER, "D");
dataTable.addRow("Mon", 20, 28, 38, 45);
dataTable.addRow("Tue", 31, 38, 55, 66);
dataTable.addRow("Wed", 50, 55, 77, 80);
dataTable.addRow("Thu", 77, 77, 66, 50);
dataTable.addRow("Fri", 68, 66, 22, 15);
// Set options
CandlestickChartOptions options = CandlestickChartOptions.create();
options.setLegend(Legend.create(LegendPosition.NONE));
// Draw the chart
chart.draw(dataTable,options);
chart.setWidth("400px");
chart.setHeight("400px");
}
public void onModuleLoad() {
initialize();
}
}
Resultado
Verifique el resultado.