kurkle / chartjs-chart-treemap

Chart.js module for creating treemap charts
MIT License
137 stars 34 forks source link

Interactions don't seem to work on rects that have x:0 or y:0 #146

Closed kurkle closed 1 year ago

kurkle commented 1 year ago

This can be observed in the RTL sample for example: https://chartjs-chart-treemap.pages.dev/samples/rtl.html

This rect works: but the top/left row does not:

image
stockiNail commented 1 year ago

@kurkle I have had a look and it seems depending on the spacing when it is set <0. Setting spacing >=0, it works

stockiNail commented 1 year ago

Having spacing <0, the X and Y of element could be out of chart area. CHART.JS, in point interaction, tests if the element is in chart area:

https://github.com/chartjs/Chart.js/blob/c849b7bc1d974c3e760c69afb32aaa0f9201aba4/src/core/core.interaction.js#L94-L112

We could add includeInvisible options to interaction controller default to true

stockiNail commented 1 year ago

Or we can check Math.max of X and Y element with chart area left and top. Or allow only spacing config >=0. The simplest solution seems to be setting includeInvisible.

@kurkle what do you think?

kurkle commented 1 year ago

includeVisible sounds good to me. negative spacing is good for animations, so I would not like to limit that.

stockiNail commented 1 year ago

We must upgrade the minimum version of Chartjs to 3.8.0 where includeInvisible option has been added