topic D3 Stacked Bar Chart with line > MAKE LEGEND CLICKABLE AND FILTERABLE in Integration, Extension & APIs

D3 Stacked Bar Chart with line > MAKE LEGEND CLICKABLE AND FILTERABLE

Adriano — Sat, 16 Nov 2024 20:05:55 GMT

Hi,
I need help with a stacked bar chart with line.
I use it as custom extension in Qlik Sense.

I would like to make legend clickable and filterable.

Do you know if there is any way?
Thank you very much in advance.

Here is the legend's code:

var legend = plot.selectAll(".legend")
.data(color.domain().slice().reverse())
.enter().append("g")
.attr("class", "legend")
.attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });

legend.append("rect")
.attr("x", width + 6 + legend_width)
.attr("width", 18)
.attr("height", 18)
.style("fill", color_2)

legend.append("text")
.attr("x", width + 30 + legend_width)
.attr("y", 9)
.attr("dy", ".35em")
.style("text-anchor", "start")
.text(function(d) { return d; })

Re: D3 Stacked Bar Chart with line > MAKE LEGEND CLICKABLE AND FILTERABLE

oz_moyal — Wed, 11 Sep 2019 13:14:07 GMT

Hi,
In general u can apply any filter from the code with:
app.field('f_name').selectValues([val], false, true);

So u can implement that (I did it with some custom chart i had in a mashup)

so u need to add click event to the chart legend
there is more small thigns to look after, like how to change selection, but it all can be done with some js code and and app field API

Re: D3 Stacked Bar Chart with line > MAKE LEGEND CLICKABLE AND FILTERABLE

Adriano — Wed, 11 Sep 2019 15:12:14 GMT

Thx Oz_moyal.

I don't use a mashup but I'm building a local app, so, where do I put the code that you passed me?
Is any way to do the same thing in a local app?

Thanks,
Adriano