|
| Re: AbstractChartControl - how to show chart [message #1840382 is a reply to message #1840225] |
Tue, 13 April 2021 15:20   |
|
Hi,
the chart table control automatically collects the necessary data from the table. You just have to add it to the table, e.g. by overriding the method addDefaultChartTableControls of the AbstractPageWithTable.
@Override
protected void addDefaultTableControls() {
super.addDefaultTableControls();
getTable().addTableControl(new ChartTableControl());
}
Best regards
Claudio
|
|
|
|
|
|
| Re: AbstractChartControl - how to show chart [message #1840582 is a reply to message #1840534] |
Mon, 19 April 2021 19:49 |
|
Thanks for the screen shots. That looks all quite correct to me.
I just tested it again with a completely fresh installation.
1. Download from https://www.eclipse.org/downloads/packages/release/2021-03/r/eclipse-ide-scout-developers
2. Generate a "Hello World" application using the wizard at the start screen (type "Java").
3. Add the necessary dependencies to pom.xml, package.json, index.js and index.less according to https://eclipsescout.github.io/11.0/technical-guide.html#how-to-create-a-chart
4. Create a very simple page and register it in WorkOutline.java (see code below).
5. Run the webpack build and start the backend and the UI server.
import org.eclipse.scout.apps.helloscout.client.helloworld.ChartTestTablePage.Table;
import org.eclipse.scout.rt.chart.client.ui.basic.table.controls.ChartTableControl;
import org.eclipse.scout.rt.client.ui.basic.table.AbstractTable;
import org.eclipse.scout.rt.client.ui.basic.table.columns.AbstractIntegerColumn;
import org.eclipse.scout.rt.client.ui.basic.table.columns.AbstractLongColumn;
import org.eclipse.scout.rt.client.ui.basic.table.columns.AbstractStringColumn;
import org.eclipse.scout.rt.client.ui.desktop.outline.pages.AbstractPageWithTable;
import org.eclipse.scout.rt.platform.Order;
import org.eclipse.scout.rt.platform.classid.ClassId;
import org.eclipse.scout.rt.shared.services.common.jdbc.SearchFilter;
@ClassId("f1ab7041-c80a-4120-92b4-f96b98b68b2d")
public class ChartTestTablePage extends AbstractPageWithTable<Table> {
public ChartTestTablePage() {
super();
}
@Override
protected boolean getConfiguredLeaf() {
return true;
}
@Override
protected String getConfiguredTitle() {
return "Chart Test";
}
@Override
protected void execLoadData(SearchFilter filter) {
importTableData(loadDemoData());
}
protected Object[][] loadDemoData() {
return new Object[][] { { "Row 1", 100, 50 }, { "Row 2", 127, 18 }, { "Row 3", 423, 1 } };
}
@Override
protected void addDefaultTableControls() {
super.addDefaultTableControls();
getTable().addTableControl(new ChartTableControl());
}
@ClassId("f318211a-df23-4821-b801-1de825ed9744")
public class Table extends AbstractTable {
public StringColumn getStringColumn() {
return getColumnSet().getColumnByClass(StringColumn.class);
}
public LongColumn getLongColumn() {
return getColumnSet().getColumnByClass(LongColumn.class);
}
public IntegerColumn getIntegerColumn() {
return getColumnSet().getColumnByClass(IntegerColumn.class);
}
@Order(10)
@ClassId("0f696383-9e07-49a0-ae9a-a88907b8a74f")
public class StringColumn extends AbstractStringColumn {
@Override
protected String getConfiguredHeaderText() {
return "Name";
}
}
@Order(20)
@ClassId("dd0bdab7-1284-4e2a-a823-cb855e00a118")
public class LongColumn extends AbstractLongColumn {
@Override
protected String getConfiguredHeaderText() {
return "Number 1";
}
}
@Order(30)
@ClassId("739203a6-4a92-47a1-87cc-ff71ecb33c10")
public class IntegerColumn extends AbstractIntegerColumn {
@Override
protected String getConfiguredHeaderText() {
return "Number 2";
}
}
}
}
For me, everything worked as expected and the chart is rendered correctly. I tried the same with the slightly older version 11.0.12, but it works fine, too.
So, what can you do? Here are some suggestions:
- Take 5 minutes and try the same test I sketched above. If this works, there must be something wrong in your project and you should be able to find the problem by comparing the two.
- Ensure that it's not a browser issue. Try a different browser and/or operating system (e.g. Firefox when you normally use Chrome) and check that no plugins might interfere. Sometimes, "ad blockers" or "malware protection" plugins overreact and block certain content in error.
- Fire up the developer tools in your browser (normally F12). Use the DOM inspector to browser the page and check if there is something at the empty space. There should be a <div> with class "chart" and a <canvas> element inside.
- As a last resort, you could try to debug the code and find out why your data is not rendered. To do so, open the developer tools and open the "Sources" panel. You can then open the file "ChartTableControl.js" and find the method called _drawChart(). Add a breakpoint, and when it is hit, you can step through the code and check at which condition the execution takes the wrong turn.
Regards,
Beat
|
|
|
|
|
Powered by
FUDForum. Page generated in 0.03466 seconds
] 
Search
Help
Register
Login
Home
