Unlock a world of possibilities! Login now and discover the exclusive benefits awaiting you.
Hi,
I have a stacked bar chart with line of Qlik-Sense-D3-Visualization-Library-master extension in my app in Qlik Sense Desktop. I would like to have the legend clickable and apply the filter to entire app.
I could implement this code as I was suggested by @oz_moyal contributor :
app.field('f_name').selectValues([val], false, true);
but I don't understand where do I put it.
Directly in the .js of the stacked bar chart? Or in the paint function of the d3-vis-library.js? Or in the sense-utils.js?
Is it the right code or you have a suggestion for other solutions?
Here the code of stacked_bar_chart.js legend:
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; })
Thank you in advance.
Hi @Adriano ,
When u build the legend u need to add to each item in the legend a click event, i'm not d3.js expert, so u better google it,
but it should be something like this:
legend.append("text")
.attr("x", width + 30 + legend_width)
.attr("y", 9)
.attr("dy", ".35em")
.style("text-anchor", "start")
.on("click", function(){alert('legend clicked');
//here u need to apply the filter to the field
});
.text(function(d) { return d; })
you need to determine which value was clicked and use it to apply the filter to the field.