0

ZkCharts drilldown back button

asked 2021-07-28 22:46:47 +0800

aUser gravatar image aUser
127 4

Hello, I would like to intercept the event that is send by the back button on a chart component with drilldowns. For example in this demo a back button is created once the user selects a pie, then once the back button is pressed the orginal series is displayed. What is the event send by the back button?

I tried putting on zk.xml of my project

<listener>
    <listener-class>demo.EventListener</listener-class>
</listener>

as someone said here but when i press the back button of my chart no event is sent.

I would like to know when the back button is pressed because when the chart has to display the first level of series, i'd like to update the chart title.

Thank you

delete flag offensive retag edit

10 Answers

Sort by ยป oldest newest most voted
1

answered 2021-08-19 15:34:29 +0800

MDuchemin gravatar image MDuchemin
1986 1 5
ZK Team

Hey there :)

There might be a few reasons why your events are not working. Could be that you have declared the composer in the wrong place, missed the apply="MyComposer" attribute in zul file, or a bunch of other things.

Rather than trying to guess, here's a sample on zkfiddle: https://zkfiddle.org/sample/1s3f71t/1-chart-drill-events

NOTE!!! ZKfiddle doesn't have the chart dependencies, so you'll need to copy that to your local project to run it. But that should give you a general idea of how these pieces fit together.

Have a look and let me know if you find what was missing on your side ;)

link publish delete flag offensive edit

Comments

From a fast test it really looks like it was the Composer.. I was using the GenericForwardComposer, now I tried SelectorComposer and the events are fired.. I guess I have to understand the difference between these Composers, thank you very much for the input though!!

aUser ( 2021-08-19 16:14:03 +0800 )edit
1

answered 2021-08-06 09:52:13 +0800

MDuchemin gravatar image MDuchemin
1986 1 5
ZK Team

Hi there,

Listeners declared in zk.xml are lifecyle listeners. They are global and are not appropriate for component listening.

Instead, you should be using either a composer (MVC) or a ViewModel (MVVM) to create either an event listener or a command binding. See here for the MVC option: https://www.zkoss.org/wiki/ZKChartsEssentials/WorkingwithZKCharts/HandlingChart_Events

Assuming that you are using the default drill down / drill up, the event you are looking for is the ChartsEvents.ON_PLOT_DRILL_UP event. (there is also a ONPLOTDRILL_DOWN version which can be used to listen to the drill down action.

https://www.zkoss.org/wiki/ZKChartsEssentials/WorkingwithZKCharts/DrillDown

link publish delete flag offensive edit
1

answered 2021-08-20 09:38:12 +0800

MDuchemin gravatar image MDuchemin
1986 1 5
ZK Team

Hey there,

GenericForwardComposer will use method names like public void onChange$mytextbox(Event event) { to register events

SelectorComposer uses annotations (@Wire, @Listen, ...) to match components / listeners with methods and fields.

I'm personally biased toward selectorComposer. ;)

link publish delete flag offensive edit
1

answered 2021-08-20 09:45:17 +0800

MDuchemin gravatar image MDuchemin
1986 1 5
ZK Team

On the drill up button customization part:

Options options = chart.getOptions();
if(options == null) {
    options = new Options();
}
options.getLang().setDrillUpText("foo bar {series.name}");
chart.setOptions(options);

details here: https://api.highcharts.com/highmaps/lang.drillUpText

{series.name} is an internal variable from highcharts, it contains the series name (if you want to display that) ;)

link publish delete flag offensive edit

Comments

Thank you very much! I was looking at the options only, didn't think about the lang object.. My bad

aUser ( 2021-08-20 18:45:21 +0800 )edit

happy to hear it's going good now ^^

As a general rule, since ZK charts is a wrapper for highcharts, if you don't know how to do something, searching for "highcharts do X Y Z" is a good way to find useful info about which property might be involved.

MDuchemin ( 2021-08-23 09:31:57 +0800 )edit
1

answered 2021-08-31 18:14:38 +0800

MDuchemin gravatar image MDuchemin
1986 1 5
ZK Team

Hey there,

Thanks for the extra info. I found the root cause and posted this issue in the tracker: https://tracker.zkoss.org/browse/ZKCHARTS-126

link publish delete flag offensive edit

Comments

Thank you for your help!

aUser ( 2021-08-31 18:47:29 +0800 )edit
0

answered 2021-08-18 16:53:08 +0800

aUser gravatar image aUser
127 4

Hello,

I'm using the MVC approach and following your instructions this is what I tried:

@Listen("onPlotDrillDown = charts")
public void drillDownEvent(ChartsEvent event) {
    System.out.println("drilldown, " + event);
}

@Listen("onPlotDrillUp = charts")
public void drillUpEvent(ChartsEvent event) {
    System.out.println("drillup, " + event);
}

I also tried using a specific ID (in my case however I need the component selector because i have multiple charts with unpredictable IDs) but no event is fired anyway.

Any ideas? :S

link publish delete flag offensive edit
0

answered 2021-08-19 16:21:58 +0800

aUser gravatar image aUser
127 4

May I also ask if it is possible to change the label of the back button once a drilldown point is clicked? What I tried is:

Series series = chart.getSeries();
series.setName("My custom label");

but this only appends to the Back to string. I would like to change the Back to label in order to have for example My custom label insted of Back to My custom label, is that possible?

link publish delete flag offensive edit
0

answered 2021-08-24 20:01:59 +0800

aUser gravatar image aUser
127 4

Sorry for bringing this thread up even if marked as resolved..

Suppose for example that I have a chart of type pie with some drilldowns, I do some drilldowns and drillups with no problems.

Now suppose that I want to change the chart's type to be of type column.. I think I found a problem here. From the jar zkcharts-7.2.1.2.jar, the class Charts.java clears the _drilldownLevels list in the invalidate function when the chart's type is changed and when I try to do again the drilldowns and drillups with the new chart's type, I get this error:

java.util.NoSuchElementException: null
at java.util.LinkedList.getFirst(LinkedList.java:244)
at org.zkoss.chart.Charts.service(Charts.java:2585)
....

This validate function is only called (as far as I tried) when I have one or more of these listeners..

@Listen(ChartsEvents.ON_PLOT_DRILL_DOWN + " = #chart")
public void drillDownEvent(ChartsEvent event) {
    System.out.println("drilldown event");
}

@Listen(ChartsEvents.ON_PLOT_DRILL_UP + " = #chart")
public void drillUpEvent(ChartsEvent event) {
    System.out.println("drillup event");
}

If I remove these, all works fine and the invalidate function is not called, but for what I have to do I need to have these listeners.

If this list is cleared, then I get the above error because the data is "not consistent" if you will. In this case do I have to copy again some data? It seems kinda strange honestly

The only reason i bring up this thread is because is related to the events I was asking for, if needed however I can create another question.

link publish delete flag offensive edit
0

answered 2021-08-27 17:15:37 +0800

MDuchemin gravatar image MDuchemin
1986 1 5
ZK Team

Regarding the NPE, could you post a longer code sample of what you are trying to do when changing the charts type?

How I would address this will depend on how you create your chart data. For example, are you using a chart model, or manually setting charts points? Do you replace the series when you change the type, etc.

I was able to track down what you mentioned with the _drilldownLevels list not being initialized, and I think it's a reasonable case to open a bug ticket, so here it is: https://tracker.zkoss.org/browse/ZKCHARTS-125

link publish delete flag offensive edit

Comments

From what I did until now, i set points manually to series. When I change the chart's type I don't change the series or its potins. When I have to add/remove points from the same Series, I simply clear the series' data and add the new Points, even though I'm not 100% sure this is the best way

aUser ( 2021-08-27 17:43:32 +0800 )edit
0

answered 2021-08-27 17:38:29 +0800

aUser gravatar image aUser
127 4

Hello,

I created this fiddle. It's literally the Pie with drillDowns from here. If you run the fiddle, do a drillDown and then a drillUp, now press the "change type" button and the chart becomes of type Column. Now do a drillDown with this type and it works fine, but when you do the drillUp it should throw an error.

Let me know if you need more info, thank you

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2021-07-28 22:46:47 +0800

Seen: 21 times

Last updated: Aug 31

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More