Updated Accounting Manager
git-svn-id: https://svn.d4science.research-infrastructures.eu/gcube/trunk/portlets/admin/accounting-manager@117488 82a268e6-3cf1-43bd-a215-b396298e98cf
This commit is contained in:
parent
bc7542c559
commit
0084de0866
|
@ -74,11 +74,12 @@ public class AccountingManager implements EntryPoint {
|
||||||
mainPanelLayout = new BorderLayoutContainer();
|
mainPanelLayout = new BorderLayoutContainer();
|
||||||
mainPanelLayout.setId("mainPanelLayout");
|
mainPanelLayout.setId("mainPanelLayout");
|
||||||
mainPanelLayout.setBorders(false);
|
mainPanelLayout.setBorders(false);
|
||||||
|
mainPanelLayout.setResize(true);
|
||||||
//mainPanelLayout.getElement().getStyle().setBackgroundColor("rgb(3, 126, 207)");
|
//mainPanelLayout.getElement().getStyle().setBackgroundColor("rgb(3, 126, 207)");
|
||||||
|
|
||||||
|
|
||||||
//Main
|
//Main
|
||||||
MainDataPanel mainDataPanel=new MainDataPanel(eventBus);
|
final MainDataPanel mainDataPanel=new MainDataPanel(eventBus);
|
||||||
MarginData mainData = new MarginData(new Margins(2));
|
MarginData mainData = new MarginData(new Margins(2));
|
||||||
mainPanelLayout.setCenterWidget(mainDataPanel, mainData);
|
mainPanelLayout.setCenterWidget(mainDataPanel, mainData);
|
||||||
|
|
||||||
|
@ -95,12 +96,14 @@ public class AccountingManager implements EntryPoint {
|
||||||
//Filters
|
//Filters
|
||||||
FiltersPanel filtersPanel=new FiltersPanel(eventBus);
|
FiltersPanel filtersPanel=new FiltersPanel(eventBus);
|
||||||
BorderLayoutData westData = new BorderLayoutData(310);
|
BorderLayoutData westData = new BorderLayoutData(310);
|
||||||
westData.setCollapsible(true);
|
westData.setCollapsible(false);
|
||||||
westData.setSplit(false);
|
westData.setSplit(false);
|
||||||
westData.setFloatable(false);
|
westData.setFloatable(false);
|
||||||
westData.setCollapseMini(true);
|
westData.setCollapseMini(false);
|
||||||
westData.setMargins(new Margins(2, 7, 2, 7));
|
westData.setMargins(new Margins(2, 7, 2, 7));
|
||||||
westData.setCollapseHidden(true);
|
westData.setCollapseHidden(true);
|
||||||
|
westData.setMaxSize(310);
|
||||||
|
westData.setMinSize(310);
|
||||||
mainPanelLayout.setWestWidget(filtersPanel, westData);
|
mainPanelLayout.setWestWidget(filtersPanel, westData);
|
||||||
filtersPanel.expand();
|
filtersPanel.expand();
|
||||||
filtersPanel.enable();
|
filtersPanel.enable();
|
||||||
|
|
|
@ -1,23 +1,10 @@
|
||||||
package org.gcube.portlets.admin.accountingmanager.client.maindata.charts;
|
package org.gcube.portlets.admin.accountingmanager.client.maindata.charts;
|
||||||
|
|
||||||
import java.util.Date;
|
import org.gcube.portlets.admin.accountingmanager.client.maindata.charts.service.VariableAxisChart;
|
||||||
|
|
||||||
import org.gcube.portlets.admin.accountingmanager.client.state.AccountingStateData;
|
import org.gcube.portlets.admin.accountingmanager.client.state.AccountingStateData;
|
||||||
import org.gcube.portlets.admin.accountingmanager.shared.data.response.SeriesService;
|
import org.gcube.portlets.admin.accountingmanager.shared.data.response.SeriesService;
|
||||||
import org.gcube.portlets.admin.accountingmanager.shared.data.response.SeriesServiceData;
|
|
||||||
import org.gcube.portlets.admin.accountingmanager.shared.exception.AccountingManagerChartDrawException;
|
import org.gcube.portlets.admin.accountingmanager.shared.exception.AccountingManagerChartDrawException;
|
||||||
|
|
||||||
import com.github.highcharts4gwt.client.view.widget.HighchartsLayoutPanel;
|
|
||||||
import com.github.highcharts4gwt.model.array.api.ArrayNumber;
|
|
||||||
import com.github.highcharts4gwt.model.array.api.ArrayString;
|
|
||||||
import com.github.highcharts4gwt.model.factory.api.HighchartsOptionFactory;
|
|
||||||
import com.github.highcharts4gwt.model.factory.jso.JsoHighchartsOptionFactory;
|
|
||||||
import com.github.highcharts4gwt.model.highcharts.option.api.ChartOptions;
|
|
||||||
import com.github.highcharts4gwt.model.highcharts.option.api.SeriesArea;
|
|
||||||
import com.github.highcharts4gwt.model.highcharts.option.api.SeriesColumn;
|
|
||||||
import com.sencha.gxt.widget.core.client.container.MarginData;
|
|
||||||
import com.sencha.gxt.widget.core.client.container.SimpleContainer;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Accounting Chart 4 Service
|
* Accounting Chart 4 Service
|
||||||
*
|
*
|
||||||
|
@ -50,226 +37,13 @@ public class AccountingChart4Service extends AccountingChartBuilder {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
SeriesService seriesService = (SeriesService) accountingStateData
|
VariableAxisChart container=new VariableAxisChart(accountingStateData);
|
||||||
.getSeriesResponse();
|
|
||||||
|
|
||||||
double minRange = ChartTimeMeasure.calculateMinRange(accountingStateData
|
|
||||||
.getSeriesRequest().getAccountingPeriod());
|
|
||||||
|
|
||||||
double interval = ChartTimeMeasure.calculateInterval(accountingStateData
|
|
||||||
.getSeriesRequest().getAccountingPeriod());
|
|
||||||
|
|
||||||
Date dateStart = accountingStateData.getSeriesRequest()
|
|
||||||
.getAccountingPeriod().getStartDate();
|
|
||||||
|
|
||||||
HighchartsOptionFactory highchartsFactory = new JsoHighchartsOptionFactory();
|
|
||||||
ChartOptions options = highchartsFactory.createChartOptions();
|
|
||||||
options.chart().zoomType("xy");
|
|
||||||
|
|
||||||
options.title().text("Accounting Service");
|
|
||||||
|
|
||||||
options.subtitle().text("Click and drag in the plot area to zoom in");
|
|
||||||
|
|
||||||
ArrayString colors = options.colors();
|
|
||||||
// colors.setValue(0, "#cc0038");
|
|
||||||
// colors.setValue(1, "#32cd32");
|
|
||||||
|
|
||||||
// xAxis
|
|
||||||
options.xAxis().type("datetime").minRange(minRange);
|
|
||||||
|
|
||||||
// yAxis
|
|
||||||
// options.yAxis().title().text("Exchange rate");
|
|
||||||
// Highcharts.getOptions().colors[0]
|
|
||||||
|
|
||||||
/*
|
|
||||||
* String multiAxis = "[{" + " \"id\": \"OperationCount\"," +
|
|
||||||
* " \"labels\": { " + " \"format\": \"{value}\"," +
|
|
||||||
* " \"style\": { " + " \"color\": \"" + colors.get(1) + "\"" +
|
|
||||||
* " }" + " }," + " \"title\": { " +
|
|
||||||
* " \"text\": \"Operation Count\"," + " \"style\": {" +
|
|
||||||
* " \"color\": \"" + colors.get(1) + "\"" + " }" + " }" +
|
|
||||||
* "} , {" + " \"id\": \"ServiceData\", " + " \"linkedTo\": \"0\","
|
|
||||||
* +" \"gridLineWidth\": \"0\"," + " \"title\": {" +
|
|
||||||
* " \"text\": \"\"," + " \"style\": {" + " \"color\": \"" +
|
|
||||||
* colors.get(1) + "\"" + " }" + " }," + " \"labels\": {" +
|
|
||||||
* " \"format\": \"{value} ms\"," + " \"style\": {" +
|
|
||||||
* " \"color\": \"" + colors.get(1) + "\"" + " }" + " }," +
|
|
||||||
* " \"opposite\": \"true\"" //+ ", \"showFirstLabel\": \"false\"" +
|
|
||||||
* "}]";
|
|
||||||
*/
|
|
||||||
|
|
||||||
String multiAxis = "[{" + " \"id\": \"OperationCount\","
|
|
||||||
+ " \"labels\": { " + " \"format\": \"{value}\","
|
|
||||||
+ " \"style\": { " + " \"color\": \""
|
|
||||||
+ colors.get(1)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"title\": { "
|
|
||||||
+ " \"text\": \"Operation Count\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(1)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " }"
|
|
||||||
+ "} , {"
|
|
||||||
+ " \"id\": \"Duration\", "
|
|
||||||
+ " \"title\": {"
|
|
||||||
+ " \"text\": \"Duration\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(0)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"labels\": {"
|
|
||||||
+ " \"format\": \"{value} ms\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(0)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"opposite\": \"true\""
|
|
||||||
+ ", \"showFirstLabel\": \"false\""
|
|
||||||
+ "} , {"
|
|
||||||
+ " \"id\": \"MaxInvocationTime\", "
|
|
||||||
+ " \"title\": {"
|
|
||||||
+ " \"text\": \"Max Invocation Time\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(2)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"labels\": {"
|
|
||||||
+ " \"format\": \"{value} ms\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(2)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"opposite\": \"true\""
|
|
||||||
+ ", \"showFirstLabel\": \"false\""
|
|
||||||
+ "} , {"
|
|
||||||
+ " \"id\": \"MinInvocationTime\", "
|
|
||||||
+ " \"title\": {"
|
|
||||||
+ " \"text\": \"Min Invocation Time\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(3)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"labels\": {"
|
|
||||||
+ " \"format\": \"{value} ms\","
|
|
||||||
+ " \"style\": {"
|
|
||||||
+ " \"color\": \""
|
|
||||||
+ colors.get(3)
|
|
||||||
+ "\""
|
|
||||||
+ " }"
|
|
||||||
+ " },"
|
|
||||||
+ " \"opposite\": \"true\""
|
|
||||||
+ ", \"showFirstLabel\": \"false\"" + "}]"
|
|
||||||
|
|
||||||
;
|
|
||||||
|
|
||||||
options.setFieldAsJsonObject("yAxis", multiAxis);
|
|
||||||
|
|
||||||
// TODO does not seem to be working
|
|
||||||
String fillcolor = "{" + "\"linearGradient\": {" + "\"x1\": 0,"
|
|
||||||
+ "\"y1\": 0," + "\"x2\": 0," + "\"y2\": 1" + "},"
|
|
||||||
+ "\"stops\": [" + "[" + "0, \"#058DC7\"" + "]," + "["
|
|
||||||
+ "1, \"#FFFFFF\"" + "]" + "]" + "}";
|
|
||||||
|
|
||||||
options.plotOptions().area()
|
|
||||||
.setFieldAsJsonObject("fillColor", fillcolor).marker()
|
|
||||||
.radius(2).lineWidth(1).states().hover().lineWidth(1);
|
|
||||||
|
|
||||||
SeriesColumn seriesOperationCount = highchartsFactory
|
|
||||||
.createSeriesColumn();
|
|
||||||
seriesOperationCount.name("Operation Count");
|
|
||||||
seriesOperationCount.color(colors.get(1));
|
|
||||||
seriesOperationCount.type("column");
|
|
||||||
|
|
||||||
ArrayNumber dataOperationCount = seriesOperationCount
|
|
||||||
.dataAsArrayNumber();
|
|
||||||
|
|
||||||
seriesOperationCount.pointInterval(interval).pointStart(
|
|
||||||
dateStart.getTime());
|
|
||||||
|
|
||||||
SeriesArea seriesDuration = highchartsFactory.createSeriesArea();
|
|
||||||
seriesDuration.name("Duration");
|
|
||||||
seriesDuration.color(colors.get(0));
|
|
||||||
seriesDuration.yAxisAsString("Duration");
|
|
||||||
|
|
||||||
ArrayNumber dataDuration = seriesDuration.dataAsArrayNumber();
|
|
||||||
|
|
||||||
seriesDuration.pointInterval(interval).pointStart(dateStart.getTime());
|
|
||||||
|
|
||||||
SeriesArea seriesMaxInvocationTime = highchartsFactory
|
|
||||||
.createSeriesArea();
|
|
||||||
seriesMaxInvocationTime.name("Max Invocation Time");
|
|
||||||
seriesMaxInvocationTime.color(colors.get(2));
|
|
||||||
seriesMaxInvocationTime.yAxisAsString("MaxInvocationTime");
|
|
||||||
|
|
||||||
ArrayNumber dataMaxInvocationTime = seriesMaxInvocationTime
|
|
||||||
.dataAsArrayNumber();
|
|
||||||
|
|
||||||
seriesMaxInvocationTime.pointInterval(interval).pointStart(
|
|
||||||
dateStart.getTime());
|
|
||||||
|
|
||||||
SeriesArea seriesMinInvocationTime = highchartsFactory
|
|
||||||
.createSeriesArea();
|
|
||||||
seriesMinInvocationTime.name("Min Invocation Time");
|
|
||||||
seriesMinInvocationTime.color(colors.get(3));
|
|
||||||
seriesMinInvocationTime.yAxisAsString("MinInvocationTime");
|
|
||||||
|
|
||||||
ArrayNumber dataMinInvocationTime = seriesMinInvocationTime
|
|
||||||
.dataAsArrayNumber();
|
|
||||||
|
|
||||||
seriesMinInvocationTime.pointInterval(interval).pointStart(
|
|
||||||
dateStart.getTime());
|
|
||||||
|
|
||||||
for (SeriesServiceData seriesServiceData : seriesService.getSeries()) {
|
|
||||||
dataOperationCount.push(seriesServiceData.getOperationCount());
|
|
||||||
dataDuration.push(seriesServiceData.getDuration());
|
|
||||||
dataMaxInvocationTime
|
|
||||||
.push(seriesServiceData.getMaxInvocationTime());
|
|
||||||
dataMinInvocationTime
|
|
||||||
.push(seriesServiceData.getMinInvocationTime());
|
|
||||||
}
|
|
||||||
|
|
||||||
options.series().addToEnd(seriesOperationCount);
|
|
||||||
options.series().addToEnd(seriesDuration);
|
|
||||||
options.series().addToEnd(seriesMaxInvocationTime);
|
|
||||||
options.series().addToEnd(seriesMinInvocationTime);
|
|
||||||
|
|
||||||
options.chart().showAxes(true);
|
|
||||||
|
|
||||||
options.legend().enabled(true);
|
|
||||||
// options.legend().layout("vertical");
|
|
||||||
// options.legend().align("left");
|
|
||||||
// options.legend().x(120);
|
|
||||||
// options.legend().verticalAlign("top");
|
|
||||||
// options.legend().y(100);
|
|
||||||
// options.legend().floating(true);
|
|
||||||
// options.legend()
|
|
||||||
// .backgroundColor(
|
|
||||||
// "(Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'white'");
|
|
||||||
|
|
||||||
HighchartsLayoutPanel highchartsLayoutPanel = new HighchartsLayoutPanel();
|
|
||||||
|
|
||||||
highchartsLayoutPanel.renderChart(options);
|
|
||||||
|
|
||||||
SimpleContainer container=new SimpleContainer();
|
|
||||||
container.add(highchartsLayoutPanel, new MarginData(0));
|
|
||||||
|
|
||||||
accountingChartPanel=new AccountingChartPanel(container);
|
accountingChartPanel=new AccountingChartPanel(container);
|
||||||
|
|
||||||
accountingChartSpec.setChart(accountingChartPanel);
|
accountingChartSpec.setChart(accountingChartPanel);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,437 @@
|
||||||
|
package org.gcube.portlets.admin.accountingmanager.client.maindata.charts.service;
|
||||||
|
|
||||||
|
import java.util.Date;
|
||||||
|
|
||||||
|
import org.gcube.portlets.admin.accountingmanager.client.maindata.charts.ChartTimeMeasure;
|
||||||
|
import org.gcube.portlets.admin.accountingmanager.client.resource.AccountingManagerResources;
|
||||||
|
import org.gcube.portlets.admin.accountingmanager.client.state.AccountingStateData;
|
||||||
|
import org.gcube.portlets.admin.accountingmanager.shared.data.response.SeriesService;
|
||||||
|
import org.gcube.portlets.admin.accountingmanager.shared.data.response.SeriesServiceData;
|
||||||
|
|
||||||
|
import com.github.highcharts4gwt.client.view.widget.HighchartsLayoutPanel;
|
||||||
|
import com.github.highcharts4gwt.model.array.api.ArrayNumber;
|
||||||
|
import com.github.highcharts4gwt.model.array.api.ArrayString;
|
||||||
|
import com.github.highcharts4gwt.model.factory.api.HighchartsOptionFactory;
|
||||||
|
import com.github.highcharts4gwt.model.factory.jso.JsoHighchartsOptionFactory;
|
||||||
|
import com.github.highcharts4gwt.model.highcharts.option.api.ChartOptions;
|
||||||
|
import com.github.highcharts4gwt.model.highcharts.option.api.SeriesArea;
|
||||||
|
import com.github.highcharts4gwt.model.highcharts.option.api.SeriesColumn;
|
||||||
|
import com.sencha.gxt.cell.core.client.ButtonCell.IconAlign;
|
||||||
|
import com.sencha.gxt.core.client.util.Margins;
|
||||||
|
import com.sencha.gxt.widget.core.client.button.ToggleButton;
|
||||||
|
import com.sencha.gxt.widget.core.client.container.BoxLayoutContainer.BoxLayoutData;
|
||||||
|
import com.sencha.gxt.widget.core.client.container.MarginData;
|
||||||
|
import com.sencha.gxt.widget.core.client.container.SimpleContainer;
|
||||||
|
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer;
|
||||||
|
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer.VerticalLayoutData;
|
||||||
|
import com.sencha.gxt.widget.core.client.event.SelectEvent;
|
||||||
|
import com.sencha.gxt.widget.core.client.event.SelectEvent.SelectHandler;
|
||||||
|
import com.sencha.gxt.widget.core.client.toolbar.ToolBar;
|
||||||
|
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* @author giancarlo email: <a
|
||||||
|
* href="mailto:g.panichi@isti.cnr.it">g.panichi@isti.cnr.it</a>
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
public class VariableAxisChart extends SimpleContainer {
|
||||||
|
|
||||||
|
private static final String SINGLE_AXIS = "Single Axis";
|
||||||
|
private AccountingStateData accountingStateData;
|
||||||
|
private HighchartsLayoutPanel highchartsLayoutPanel;
|
||||||
|
|
||||||
|
public VariableAxisChart(AccountingStateData accountingStateData) {
|
||||||
|
this.accountingStateData = accountingStateData;
|
||||||
|
forceLayoutOnResize=true;
|
||||||
|
create();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
private void create() {
|
||||||
|
ToolBar toolBar = new ToolBar();
|
||||||
|
toolBar.setSpacing(2);
|
||||||
|
final ToggleButton toggleBtn = new ToggleButton(SINGLE_AXIS);
|
||||||
|
toggleBtn.setIcon(AccountingManagerResources.INSTANCE.accountingChartVariableAxis24());
|
||||||
|
toggleBtn.setIconAlign(IconAlign.RIGHT);
|
||||||
|
toggleBtn.setValue(false);
|
||||||
|
|
||||||
|
toggleBtn.addSelectHandler(new SelectHandler() {
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public void onSelect(SelectEvent event) {
|
||||||
|
if(toggleBtn.getValue()){
|
||||||
|
ChartOptions options = createSingleAxisChart();
|
||||||
|
highchartsLayoutPanel.renderChart(options);
|
||||||
|
} else {
|
||||||
|
ChartOptions options = createMultiAxisChart();
|
||||||
|
highchartsLayoutPanel.renderChart(options);
|
||||||
|
}
|
||||||
|
forceLayout();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
toolBar.add(toggleBtn, new BoxLayoutData(new Margins(0)));
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//
|
||||||
|
ChartOptions options = createMultiAxisChart();
|
||||||
|
|
||||||
|
highchartsLayoutPanel = new HighchartsLayoutPanel();
|
||||||
|
highchartsLayoutPanel.renderChart(options);
|
||||||
|
|
||||||
|
//
|
||||||
|
VerticalLayoutContainer vert = new VerticalLayoutContainer();
|
||||||
|
vert.add(toolBar, new VerticalLayoutData(1, -1, new Margins(0)));
|
||||||
|
vert.add(highchartsLayoutPanel, new VerticalLayoutData(1, 1,
|
||||||
|
new Margins(0)));
|
||||||
|
|
||||||
|
add(vert, new MarginData(0));
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
private ChartOptions createMultiAxisChart() {
|
||||||
|
SeriesService seriesService = (SeriesService) accountingStateData
|
||||||
|
.getSeriesResponse();
|
||||||
|
|
||||||
|
double minRange = ChartTimeMeasure
|
||||||
|
.calculateMinRange(accountingStateData.getSeriesRequest()
|
||||||
|
.getAccountingPeriod());
|
||||||
|
|
||||||
|
double interval = ChartTimeMeasure
|
||||||
|
.calculateInterval(accountingStateData.getSeriesRequest()
|
||||||
|
.getAccountingPeriod());
|
||||||
|
|
||||||
|
Date dateStart = accountingStateData.getSeriesRequest()
|
||||||
|
.getAccountingPeriod().getStartDate();
|
||||||
|
|
||||||
|
HighchartsOptionFactory highchartsFactory = new JsoHighchartsOptionFactory();
|
||||||
|
ChartOptions options = highchartsFactory.createChartOptions();
|
||||||
|
options.chart().zoomType("xy");
|
||||||
|
|
||||||
|
options.title().text("Accounting Service");
|
||||||
|
|
||||||
|
options.subtitle().text("Click and drag in the plot area to zoom in");
|
||||||
|
|
||||||
|
ArrayString colors = options.colors();
|
||||||
|
// colors.setValue(0, "#cc0038");
|
||||||
|
// colors.setValue(1, "#32cd32");
|
||||||
|
|
||||||
|
// xAxis
|
||||||
|
options.xAxis().type("datetime").minRange(minRange);
|
||||||
|
|
||||||
|
// yAxis
|
||||||
|
String multiAxis = "[{" + " \"id\": \"OperationCount\","
|
||||||
|
+ " \"labels\": { " + " \"format\": \"{value}\","
|
||||||
|
+ " \"style\": { " + " \"color\": \""
|
||||||
|
+ colors.get(1)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"title\": { "
|
||||||
|
+ " \"text\": \"Operation Count\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(1)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " }"
|
||||||
|
+ "} , {"
|
||||||
|
+ " \"id\": \"Duration\", "
|
||||||
|
+ " \"title\": {"
|
||||||
|
+ " \"text\": \"Duration\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(0)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"labels\": {"
|
||||||
|
+ " \"format\": \"{value} ms\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(0)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"opposite\": \"true\""
|
||||||
|
+ ", \"showFirstLabel\": \"false\""
|
||||||
|
+ "} , {"
|
||||||
|
+ " \"id\": \"MaxInvocationTime\", "
|
||||||
|
+ " \"title\": {"
|
||||||
|
+ " \"text\": \"Max Invocation Time\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(2)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"labels\": {"
|
||||||
|
+ " \"format\": \"{value} ms\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(2)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"opposite\": \"true\""
|
||||||
|
+ ", \"showFirstLabel\": \"false\""
|
||||||
|
+ "} , {"
|
||||||
|
+ " \"id\": \"MinInvocationTime\", "
|
||||||
|
+ " \"title\": {"
|
||||||
|
+ " \"text\": \"Min Invocation Time\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(3)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"labels\": {"
|
||||||
|
+ " \"format\": \"{value} ms\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(3)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"opposite\": \"true\""
|
||||||
|
+ ", \"showFirstLabel\": \"false\"" + "}]"
|
||||||
|
|
||||||
|
;
|
||||||
|
|
||||||
|
options.setFieldAsJsonObject("yAxis", multiAxis);
|
||||||
|
|
||||||
|
// TODO does not seem to be working
|
||||||
|
String fillcolor = "{" + "\"linearGradient\": {" + "\"x1\": 0,"
|
||||||
|
+ "\"y1\": 0," + "\"x2\": 0," + "\"y2\": 1" + "},"
|
||||||
|
+ "\"stops\": [" + "[" + "0, \"#058DC7\"" + "]," + "["
|
||||||
|
+ "1, \"#FFFFFF\"" + "]" + "]" + "}";
|
||||||
|
|
||||||
|
options.plotOptions().area()
|
||||||
|
.setFieldAsJsonObject("fillColor", fillcolor).marker()
|
||||||
|
.radius(2).lineWidth(1).states().hover().lineWidth(1);
|
||||||
|
|
||||||
|
SeriesColumn seriesOperationCount = highchartsFactory
|
||||||
|
.createSeriesColumn();
|
||||||
|
seriesOperationCount.name("Operation Count");
|
||||||
|
seriesOperationCount.color(colors.get(1));
|
||||||
|
seriesOperationCount.type("column");
|
||||||
|
|
||||||
|
ArrayNumber dataOperationCount = seriesOperationCount
|
||||||
|
.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesOperationCount.pointInterval(interval).pointStart(
|
||||||
|
dateStart.getTime());
|
||||||
|
|
||||||
|
SeriesArea seriesDuration = highchartsFactory.createSeriesArea();
|
||||||
|
seriesDuration.name("Duration");
|
||||||
|
seriesDuration.color(colors.get(0));
|
||||||
|
seriesDuration.yAxisAsString("Duration");
|
||||||
|
|
||||||
|
ArrayNumber dataDuration = seriesDuration.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesDuration.pointInterval(interval).pointStart(dateStart.getTime());
|
||||||
|
|
||||||
|
SeriesArea seriesMaxInvocationTime = highchartsFactory
|
||||||
|
.createSeriesArea();
|
||||||
|
seriesMaxInvocationTime.name("Max Invocation Time");
|
||||||
|
seriesMaxInvocationTime.color(colors.get(2));
|
||||||
|
seriesMaxInvocationTime.yAxisAsString("MaxInvocationTime");
|
||||||
|
|
||||||
|
ArrayNumber dataMaxInvocationTime = seriesMaxInvocationTime
|
||||||
|
.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesMaxInvocationTime.pointInterval(interval).pointStart(
|
||||||
|
dateStart.getTime());
|
||||||
|
|
||||||
|
SeriesArea seriesMinInvocationTime = highchartsFactory
|
||||||
|
.createSeriesArea();
|
||||||
|
seriesMinInvocationTime.name("Min Invocation Time");
|
||||||
|
seriesMinInvocationTime.color(colors.get(3));
|
||||||
|
seriesMinInvocationTime.yAxisAsString("MinInvocationTime");
|
||||||
|
|
||||||
|
ArrayNumber dataMinInvocationTime = seriesMinInvocationTime
|
||||||
|
.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesMinInvocationTime.pointInterval(interval).pointStart(
|
||||||
|
dateStart.getTime());
|
||||||
|
|
||||||
|
for (SeriesServiceData seriesServiceData : seriesService.getSeries()) {
|
||||||
|
dataOperationCount.push(seriesServiceData.getOperationCount());
|
||||||
|
dataDuration.push(seriesServiceData.getDuration());
|
||||||
|
dataMaxInvocationTime
|
||||||
|
.push(seriesServiceData.getMaxInvocationTime());
|
||||||
|
dataMinInvocationTime
|
||||||
|
.push(seriesServiceData.getMinInvocationTime());
|
||||||
|
}
|
||||||
|
|
||||||
|
options.series().addToEnd(seriesOperationCount);
|
||||||
|
options.series().addToEnd(seriesDuration);
|
||||||
|
options.series().addToEnd(seriesMaxInvocationTime);
|
||||||
|
options.series().addToEnd(seriesMinInvocationTime);
|
||||||
|
|
||||||
|
options.chart().showAxes(true);
|
||||||
|
|
||||||
|
options.legend().enabled(true);
|
||||||
|
// options.legend().layout("vertical");
|
||||||
|
// options.legend().align("left");
|
||||||
|
// options.legend().x(120);
|
||||||
|
// options.legend().verticalAlign("top");
|
||||||
|
// options.legend().y(100);
|
||||||
|
// options.legend().floating(true);
|
||||||
|
// options.legend()
|
||||||
|
// .backgroundColor(
|
||||||
|
// "(Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'white'");
|
||||||
|
return options;
|
||||||
|
}
|
||||||
|
|
||||||
|
private ChartOptions createSingleAxisChart() {
|
||||||
|
SeriesService seriesService = (SeriesService) accountingStateData
|
||||||
|
.getSeriesResponse();
|
||||||
|
|
||||||
|
double minRange = ChartTimeMeasure
|
||||||
|
.calculateMinRange(accountingStateData.getSeriesRequest()
|
||||||
|
.getAccountingPeriod());
|
||||||
|
|
||||||
|
double interval = ChartTimeMeasure
|
||||||
|
.calculateInterval(accountingStateData.getSeriesRequest()
|
||||||
|
.getAccountingPeriod());
|
||||||
|
|
||||||
|
Date dateStart = accountingStateData.getSeriesRequest()
|
||||||
|
.getAccountingPeriod().getStartDate();
|
||||||
|
|
||||||
|
HighchartsOptionFactory highchartsFactory = new JsoHighchartsOptionFactory();
|
||||||
|
ChartOptions options = highchartsFactory.createChartOptions();
|
||||||
|
options.chart().zoomType("xy");
|
||||||
|
|
||||||
|
options.title().text("Accounting Service");
|
||||||
|
|
||||||
|
options.subtitle().text("Click and drag in the plot area to zoom in");
|
||||||
|
|
||||||
|
ArrayString colors = options.colors();
|
||||||
|
// colors.setValue(0, "#cc0038");
|
||||||
|
// colors.setValue(1, "#32cd32");
|
||||||
|
|
||||||
|
// xAxis
|
||||||
|
options.xAxis().type("datetime").minRange(minRange);
|
||||||
|
|
||||||
|
// yAxis
|
||||||
|
// options.yAxis().title().text("Exchange rate");
|
||||||
|
// Highcharts.getOptions().colors[0]
|
||||||
|
|
||||||
|
String multiAxis = "[{" + " \"id\": \"OperationCount\","
|
||||||
|
+ " \"labels\": { " + " \"format\": \"{value}\","
|
||||||
|
+ " \"style\": { " + " \"color\": \""
|
||||||
|
+ colors.get(1)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"title\": { "
|
||||||
|
+ " \"text\": \"Operation Count\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(1)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " }"
|
||||||
|
+ "} , {"
|
||||||
|
+ " \"id\": \"ServiceData\", "
|
||||||
|
+ " \"linkedTo\": \"0\","
|
||||||
|
+ " \"gridLineWidth\": \"0\","
|
||||||
|
+ " \"title\": {"
|
||||||
|
+ " \"text\": \"\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(1)
|
||||||
|
+ "\""
|
||||||
|
+ " }"
|
||||||
|
+ " },"
|
||||||
|
+ " \"labels\": {"
|
||||||
|
+ " \"format\": \"{value} ms\","
|
||||||
|
+ " \"style\": {"
|
||||||
|
+ " \"color\": \""
|
||||||
|
+ colors.get(1)
|
||||||
|
+ "\"" + " }" + " }," + " \"opposite\": \"true\"" + // +
|
||||||
|
// ", \"showFirstLabel\": \"false\""
|
||||||
|
// +
|
||||||
|
"}]";
|
||||||
|
|
||||||
|
options.setFieldAsJsonObject("yAxis", multiAxis);
|
||||||
|
|
||||||
|
// TODO does not seem to be working
|
||||||
|
String fillcolor = "{" + "\"linearGradient\": {" + "\"x1\": 0,"
|
||||||
|
+ "\"y1\": 0," + "\"x2\": 0," + "\"y2\": 1" + "},"
|
||||||
|
+ "\"stops\": [" + "[" + "0, \"#058DC7\"" + "]," + "["
|
||||||
|
+ "1, \"#FFFFFF\"" + "]" + "]" + "}";
|
||||||
|
|
||||||
|
options.plotOptions().area()
|
||||||
|
.setFieldAsJsonObject("fillColor", fillcolor).marker()
|
||||||
|
.radius(2).lineWidth(1).states().hover().lineWidth(1);
|
||||||
|
|
||||||
|
SeriesColumn seriesOperationCount = highchartsFactory
|
||||||
|
.createSeriesColumn();
|
||||||
|
seriesOperationCount.name("Operation Count");
|
||||||
|
seriesOperationCount.color(colors.get(1));
|
||||||
|
seriesOperationCount.type("column");
|
||||||
|
|
||||||
|
ArrayNumber dataOperationCount = seriesOperationCount
|
||||||
|
.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesOperationCount.pointInterval(interval).pointStart(
|
||||||
|
dateStart.getTime());
|
||||||
|
|
||||||
|
SeriesArea seriesDuration = highchartsFactory.createSeriesArea();
|
||||||
|
seriesDuration.name("Duration");
|
||||||
|
seriesDuration.color(colors.get(0));
|
||||||
|
|
||||||
|
ArrayNumber dataDuration = seriesDuration.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesDuration.pointInterval(interval).pointStart(dateStart.getTime());
|
||||||
|
|
||||||
|
SeriesArea seriesMaxInvocationTime = highchartsFactory
|
||||||
|
.createSeriesArea();
|
||||||
|
seriesMaxInvocationTime.name("Max Invocation Time");
|
||||||
|
seriesMaxInvocationTime.color(colors.get(2));
|
||||||
|
|
||||||
|
ArrayNumber dataMaxInvocationTime = seriesMaxInvocationTime
|
||||||
|
.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesMaxInvocationTime.pointInterval(interval).pointStart(
|
||||||
|
dateStart.getTime());
|
||||||
|
|
||||||
|
SeriesArea seriesMinInvocationTime = highchartsFactory
|
||||||
|
.createSeriesArea();
|
||||||
|
seriesMinInvocationTime.name("Min Invocation Time");
|
||||||
|
seriesMinInvocationTime.color(colors.get(3));
|
||||||
|
//seriesMinInvocationTime.yAxisAsString("MinInvocationTime");
|
||||||
|
|
||||||
|
ArrayNumber dataMinInvocationTime = seriesMinInvocationTime
|
||||||
|
.dataAsArrayNumber();
|
||||||
|
|
||||||
|
seriesMinInvocationTime.pointInterval(interval).pointStart(
|
||||||
|
dateStart.getTime());
|
||||||
|
|
||||||
|
for (SeriesServiceData seriesServiceData : seriesService.getSeries()) {
|
||||||
|
dataOperationCount.push(seriesServiceData.getOperationCount());
|
||||||
|
dataDuration.push(seriesServiceData.getDuration());
|
||||||
|
dataMaxInvocationTime
|
||||||
|
.push(seriesServiceData.getMaxInvocationTime());
|
||||||
|
dataMinInvocationTime
|
||||||
|
.push(seriesServiceData.getMinInvocationTime());
|
||||||
|
}
|
||||||
|
|
||||||
|
options.series().addToEnd(seriesOperationCount);
|
||||||
|
options.series().addToEnd(seriesDuration);
|
||||||
|
options.series().addToEnd(seriesMaxInvocationTime);
|
||||||
|
options.series().addToEnd(seriesMinInvocationTime);
|
||||||
|
|
||||||
|
options.chart().showAxes(true);
|
||||||
|
|
||||||
|
options.legend().enabled(true);
|
||||||
|
return options;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -107,4 +107,13 @@ public interface AccountingManagerResources extends ClientBundle {
|
||||||
@Source("accounting-reload_48.png")
|
@Source("accounting-reload_48.png")
|
||||||
ImageResource accountingReload48();
|
ImageResource accountingReload48();
|
||||||
|
|
||||||
|
@Source("accounting-chart-variable-axis_16.png")
|
||||||
|
ImageResource accountingChartVariableAxis16();
|
||||||
|
|
||||||
|
@Source("accounting-chart-variable-axis_24.png")
|
||||||
|
ImageResource accountingChartVariableAxis24();
|
||||||
|
|
||||||
|
@Source("accounting-chart-variable-axis_32.png")
|
||||||
|
ImageResource accountingChartVariableAxis32();
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 615 B |
Binary file not shown.
After Width: | Height: | Size: 952 B |
Binary file not shown.
After Width: | Height: | Size: 1.3 KiB |
|
@ -24,8 +24,8 @@
|
||||||
<inherits name="com.allen_sauer.gwt.log.gwt-log-TRACE" />
|
<inherits name="com.allen_sauer.gwt.log.gwt-log-TRACE" />
|
||||||
|
|
||||||
<!-- Debug CSS style -->
|
<!-- Debug CSS style -->
|
||||||
<!-- <set-configuration-property name="CssResource.style" value="pretty"
|
<!-- <set-configuration-property name="CssResource.style"
|
||||||
/> -->
|
value="pretty" /> -->
|
||||||
|
|
||||||
<!--<inherits name="org.moxieapps.gwt.highcharts.Highcharts"/> -->
|
<!--<inherits name="org.moxieapps.gwt.highcharts.Highcharts"/> -->
|
||||||
<inherits name='com.github.highcharts4gwt.highcharts' />
|
<inherits name='com.github.highcharts4gwt.highcharts' />
|
||||||
|
@ -48,17 +48,18 @@
|
||||||
name="locale" values="es" /> <set-property name="locale" value="en, it, es"
|
name="locale" values="es" /> <set-property name="locale" value="en, it, es"
|
||||||
/> <set-property-fallback name="locale" value="en" /> -->
|
/> <set-property-fallback name="locale" value="en" /> -->
|
||||||
|
|
||||||
<!-- <set-property name="log_ConsoleLogger" value="ENABLED" />
|
<!-- <set-property name="log_ConsoleLogger" value="ENABLED" /> <set-property
|
||||||
<set-property name="log_DivLogger" value="ENABLED" />
|
name="log_DivLogger" value="ENABLED" /> <set-property name="log_GWTLogger"
|
||||||
<set-property name="log_GWTLogger" value="ENABLED" />
|
value="ENABLED" /> <set-property name="log_SystemLogger" value="ENABLED"
|
||||||
<set-property name="log_SystemLogger" value="ENABLED" /> -->
|
/> -->
|
||||||
<!-- Not in GWT 2.6 <set-property name="log_FirebugLogger" value="ENABLED"
|
<!-- Not in GWT 2.6 <set-property name="log_FirebugLogger" value="ENABLED"
|
||||||
/> -->
|
/> -->
|
||||||
|
|
||||||
<set-property name="log_ConsoleLogger" value="DISABLED" /> <set-property
|
|
||||||
name="log_DivLogger" value="DISABLED" /> <set-property name="log_GWTLogger"
|
<set-property name="log_ConsoleLogger" value="DISABLED" />
|
||||||
value="DISABLED" /> <set-property name="log_SystemLogger" value="DISABLED"
|
<set-property name="log_DivLogger" value="DISABLED" />
|
||||||
/>
|
<set-property name="log_GWTLogger" value="DISABLED" />
|
||||||
|
<set-property name="log_SystemLogger" value="DISABLED" />
|
||||||
<!-- Not in GWT 2.6 <set-property name="log_FirebugLogger" value="DISABLED"
|
<!-- Not in GWT 2.6 <set-property name="log_FirebugLogger" value="DISABLED"
|
||||||
/> -->
|
/> -->
|
||||||
|
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 615 B |
Binary file not shown.
After Width: | Height: | Size: 952 B |
Binary file not shown.
After Width: | Height: | Size: 1.3 KiB |
Loading…
Reference in New Issue