0

Chart legend is not cleaned

asked 2020-11-20 18:49:37 +0800

softteam gravatar image softteam
120 8

Hello,

I got a chart that is filled with a CategoryModel and when I want to reload it with only some data, the chart legend is not cleaned and it shows the previous chart legend. First it is shown correctly:

image description

And then, if I reload the chart only with the data whose legend is marked in red:

image description

It shows all the previous legend. What I have:

.zul:

<charts id="chartCumplimientosZonas" type="column" model="@bind(vm.modelCumpliZonas)"/>

.java:

private Charts chartCumplimientosZonas;
private CategoryModel modelCumpliZonas;

modelCumpliZonas = getModelCumpliZonas(); //Load data
chartCumplimientosZonas.setModel(modelCumpliZonas);
chartCumplimientosZonas.getXAxis().setCrosshair(true);
chartCumplimientosZonas.getTooltip().setPointFormat("{series.name}: <b>{point.y:.1f}%</b>");
chartCumplimientosZonas.getYAxis().getTitle().setText("%");
chartCumplimientosZonas.getYAxis().setMax(105);
chartCumplimientosZonas.getYAxis().setMin(0);
chartCumplimientosZonas.getPlotOptions().getBar().getDataLabels().setEnabled(true);
chartCumplimientosZonas.getCredits().setEnabled(false);
chartCumplimientosZonas.getPlotOptions().getColumn().setPointPadding(0.2);;
chartCumplimientosZonas.getPlotOptions().getColumn().setBorderWidth(0);
chartCumplimientosZonas.getExporting().setEnabled(opcionesGraficos);
chartCumplimientosZonas.setWidth(null);

chartCumplimientoZonas.getModel() has these values:

All data:

categoryList: [DROGUERIA, PERFUMERIA, ZONA BEBÉ, ] seriesList: [P&G 1Q - HIPERCOR-ECI MAYO 2020, P&G CARREFOUR 1Q OCTUBRE 2020, P&G CARREFOUR 1Q SEPTIEMBRE 2020, P&G CARREFOUR 2Q SEPTIEMBRE 2020, P&G ECI HIPERCOR 2Q MAYO 2020, P&G ECI HIPERCOR 3Q MAYO 2020, P&G Eroski Hiper y Super 2Q Mayo 2020, P&G HIPERCOR ECI 1Q SEPTIEMBRE 2020, P&G HIPERCOR ECI 2Q SEPTIEMBRE 2020, P&G HIPERCOR ECI SUPERCOR 1Q OCTUBRE 2020, P&G HIPERCOR-ECI 2Q AGOSTO 2020, P&G HIPERCOR-ECI-SUPERCOR 1Q AGOSTO 2020, P&G HIPERCOR-ECI-SUPERCOR 1Q JULIO 2020, P&G HIPERCOR-ECI-SUPERCOR 1Q JUNIO 2020, P&G HIPERCOR-ECI-SUPERCOR 2Q JULIO 2020, P&G _ CARREFOUR 1Q AGOSTO 2020, P&G _ EROSKI 1Q AGOSTO 2020, P&G _ EROSKI 2Q JULIO 2020, P&GCARREFOUR 1Q JULIO 2020, P&GCARREFOUR 2Q AGOSTO 20, P&GCRF 2Q JULIO 20] seriesMap: {P&G CARREFOUR 1Q OCTUBRE 2020=[PERFUMERIA], P&G HIPERCOR-ECI 2Q AGOSTO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G _ CARREFOUR 1Q AGOSTO 2020=[PERFUMERIA], P&GCARREFOUR 2Q AGOSTO 20=[PERFUMERIA], P&G HIPERCOR ECI 1Q SEPTIEMBRE 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G ECI HIPERCOR 3Q MAYO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G Eroski Hiper y Super 2Q Mayo 2020=[], P&G CARREFOUR 2Q SEPTIEMBRE 2020=[PERFUMERIA], P&GCARREFOUR 1Q JULIO 2020=[PERFUMERIA], P&G ECI HIPERCOR 2Q MAYO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G HIPERCOR-ECI-SUPERCOR 1Q JULIO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G HIPERCOR ECI SUPERCOR 1Q OCTUBRE 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G _ EROSKI 1Q AGOSTO 2020=[DROGUERIA], P&G _ EROSKI 2Q JULIO 2020=[DROGUERIA], P&G HIPERCOR ECI 2Q SEPTIEMBRE 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G 1Q - HIPERCOR-ECI MAYO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G HIPERCOR-ECI-SUPERCOR 1Q AGOSTO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&GCRF 2Q JULIO 20=[PERFUMERIA], P&G CARREFOUR 1Q SEPTIEMBRE 2020=[PERFUMERIA, ZONA BEBÉ], P&G HIPERCOR-ECI-SUPERCOR 2Q JULIO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ], P&G HIPERCOR-ECI-SUPERCOR 1Q JUNIO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ]} valueMap: {[P&G 1Q - HIPERCOR-ECI MAYO 2020, DROGUERIA]=64.0, [P&G 1Q - HIPERCOR-ECI MAYO 2020, PERFUMERIA]=41.0, [P&G 1Q - HIPERCOR-ECI MAYO 2020, ZONA BEBÉ]=71.0, [P&G CARREFOUR 1Q OCTUBRE 2020, PERFUMERIA]=28.0, [P&G CARREFOUR 1Q SEPTIEMBRE 2020, PERFUMERIA]=26.0, [P&G CARREFOUR 1Q SEPTIEMBRE 2020, ZONA BEBÉ]=13.0, [P&G CARREFOUR 2Q SEPTIEMBRE 2020, PERFUMERIA]=46.0, [P&G ECI HIPERCOR 2Q MAYO 2020, DROGUERIA]=64.0, [P&G ECI HIPERCOR 2Q MAYO 2020, PERFUMERIA]=63.0, [P&G ECI HIPERCOR 2Q MAYO 2020, ZONA BEBÉ]=58.0, [P&G ECI HIPERCOR 3Q MAYO 2020, DROGUERIA]=68.0, [P&G ECI HIPERCOR 3Q MAYO 2020, PERFUMERIA]=59.0, [P&G ECI HIPERCOR 3Q MAYO 2020, ZONA BEBÉ]=67.0, [P&G Eroski Hiper y Super 2Q Mayo 2020, ]=89.0, [P&G HIPERCOR ECI 1Q SEPTIEMBRE 2020, DROGUERIA]=77.0, [P&G HIPERCOR ECI 1Q SEPTIEMBRE 2020, PERFUMERIA]=69.0, [P&G HIPERCOR ECI 1Q SEPTIEMBRE 2020, ZONA BEBÉ]=67.0, [P&G HIPERCOR ECI 2Q SEPTIEMBRE 2020, DROGUERIA]=76.0, [P&G HIPERCOR ECI 2Q SEPTIEMBRE 2020, PERFUMERIA]=71.0, [P&G HIPERCOR ECI 2Q SEPTIEMBRE 2020, ZONA BEBÉ]=60.0, [P&G HIPERCOR ECI SUPERCOR 1Q OCTUBRE 2020, DROGUERIA]=40.0, [P&G HIPERCOR ECI SUPERCOR 1Q OCTUBRE 2020, PERFUMERIA]=47.0, [P&G HIPERCOR ECI SUPERCOR 1Q OCTUBRE 2020, ZONA BEBÉ]=41.0, [P&G HIPERCOR-ECI 2Q AGOSTO 2020, DROGUERIA]=71.0, [P&G HIPERCOR-ECI 2Q AGOSTO 2020, PERFUMERIA]=70.0, [P&G HIPERCOR-ECI 2Q AGOSTO 2020, ZONA BEBÉ]=35.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q AGOSTO 2020, DROGUERIA]=54.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q AGOSTO 2020, PERFUMERIA]=60.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q AGOSTO 2020, ZONA BEBÉ]=56.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q JULIO 2020, DROGUERIA]=44.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q JULIO 2020, PERFUMERIA]=51.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q JULIO 2020, ZONA BEBÉ]=42.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q JUNIO 2020, DROGUERIA]=60.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q JUNIO 2020, PERFUMERIA]=47.0, [P&G HIPERCOR-ECI-SUPERCOR 1Q JUNIO 2020, ZONA BEBÉ]=65.0, [P&G HIPERCOR-ECI-SUPERCOR 2Q JULIO 2020, DROGUERIA]=52.0, [P&G HIPERCOR-ECI-SUPERCOR 2Q JULIO 2020, PERFUMERIA]=49.0, [P&G HIPERCOR-ECI-SUPERCOR 2Q JULIO 2020, ZONA BEBÉ]=48.0, [P&G _ CARREFOUR 1Q AGOSTO 2020, PERFUMERIA]=15.0, [P&G _ EROSKI 1Q AGOSTO 2020, DROGUERIA]=48.0, [P&G _ EROSKI 2Q JULIO 2020, DROGUERIA]=69.0, [P&GCARREFOUR 1Q JULIO 2020, PERFUMERIA]=62.0, [P&GCARREFOUR 2Q AGOSTO 20, PERFUMERIA]=25.0, [P&G_CRF 2Q JULIO 20, PERFUMERIA]=42.0}

New data:

categoryList: [DROGUERIA, PERFUMERIA, ZONA BEBÉ] seriesList: [P&G 1Q - HIPERCOR-ECI MAYO 2020] seriesMap: {P&G 1Q - HIPERCOR-ECI MAYO 2020=[DROGUERIA, PERFUMERIA, ZONA BEBÉ]} valueMap: {[P&G 1Q - HIPERCOR-ECI MAYO 2020, DROGUERIA]=64.0, [P&G 1Q - HIPERCOR-ECI MAYO 2020, PERFUMERIA]=41.0, [P&G 1Q - HIPERCOR-ECI MAYO 2020, ZONA BEBÉ]=71.0}

Why chart legend shows all items instead of only showing P&G 1Q - HIPERCOR-ECI MAYO 2020?

Thank you, Javier

delete flag offensive retag edit

3 Answers

Sort by » oldest newest most voted
0

answered 2020-11-24 17:30:29 +0800

MDuchemin gravatar image MDuchemin
1776 1 5
ZK Team

Hi There,

Tested a similar structure on ZKCharts 7.2.1.2 / ZK 9, but couldn't get a reproducing case.

Which ZKCharts / ZK version are you running currently?

A few questions: When you update the model, do you call either @notifyChange or BindUtils.postNotifyChange on the vm.modelCumpliZonas property? Or do you trigger the update in a different way? Do you generate an entirely new model object, or do you update values in the exiting CategoryModel object?

As a workaround, you could try to invalidate the charts component when you change the model content, but I would only do that as last resort, since it's more expensive than just triggering an update.

and finally one (not relevant) nitpick: the charts model="@bind(vm.model)" could be changed for a @load(), since the chart will never send a model to the VM. :D

link publish delete flag offensive edit
0

answered 2020-11-26 17:22:08 +0800

softteam gravatar image softteam
120 8

Hi,

We are running ZKCharts version 7.2.1.1 and ZK version 9.1.0.

When we update the model we generate a new DefaultCategoryModel() like:

model = new DefaultCategoryModel();
//Some process that get data and save it in model
modelCumpliZonas = model;
chartCumplimientosZonas.setModel(modelCumpliZonas);

In this case, should we trigger the update with BindUtils.postNotifyChange(null,null,this,"modelCumpliZonas")?

I tried to replace

chartCumplimientosZonas.setModel(modelCumpliZonas)

with

BindUtils.postNotifyChange(null,null,this,"modelCumpliZonas")

But I got the same comportament.

I also tried chartCumplimientosZonas.invalidate(); before create a new model object but nothing changed.

Thank you,

Javier

link publish delete flag offensive edit
0

answered 2020-11-26 18:26:39 +0800

MDuchemin gravatar image MDuchemin
1776 1 5
ZK Team

Hi Javier,

Based on the description, it sounds like the charts component still sends a lot of series data to the client, when it should only send the one serie that exists in your 2nd dataset.

To confirm this, you should check the network panel in the browser's developer tools, and check the zkau request/response containing the update to the charts.

You should see something like:

{"rs":[["outer",[{$u:'yourChartUUID'},[
['chart.Charts','UUID',{id:'yourChartId',plotData:{"chart":{"type":"column"},"series":[{"data":[20,null,null,null],"name":"Name1"},{"data":[null,35,null,null],"name":"Name2"}...

If the issue is at client side, you should only see the single series name (the one containing values in your screen)

in that case, you may want to post a bug with the official ZK support

If the issue is that the configuration for this chart object contains too many entries, you should see data entries for each of the names displayed in the legend.

In that case, you should put a breakpoint in your dataset generation code, to make sure that you are not adding empty series, or series with a name but no data points to the model

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: 2020-11-20 18:49:37 +0800

Seen: 7 times

Last updated: Nov 26

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