customdata not working in x/y/z heatmap

[etpinard]

in both hovertemplate and hover data.

See https://codepen.io/etpinard/pen/bGGNXoz?editors=1010

[etpinard]

Even worse: pointNumber is 2D: https://codepen.io/etpinard/pen/jOOPqmr?editors=1010

This is obviously wrong for x/y/z heatmaps.

[etpinard]

We should probably build a 2d-indices-to-1d-index map somewhere in convert_column_xyz.js instead of building 2d version of the arrayOk attributes e.g. for text and hovertext:

plotly.js/src/traces/heatmap/convert_column_xyz.js

Lines 37 to 42 in bead43f

	if(hasColumnText) {
	text = Lib.init2dArray(col2vals.length, col1vals.length);
	}
	if(hasColumnHoverText) {
	hovertext = Lib.init2dArray(col2vals.length, col1vals.length);
	}

plotly.js/src/traces/heatmap/convert_column_xyz.js

Lines 56 to 57 in bead43f

	if(hasColumnText) text[i2][i1] = textCol[i];
	if(hasColumnHoverText) hovertext[i2][i1] = hoverTextCol[i];

[brian428]

Just ran into this and was wondering a fix is planned soon? I'm looking at trying to look up the custom data value "manually", but the pointNumber 2D array doesn't seem to correspond with anything I can use to locate an object in the customdata array. It also doesn't look like there's a way to pass anything else through to the hover event handler (I tried using text, hovertext, etc. to try and pass some lookup value through).

Edit: Actually, it looks like I can look up the custom data index using pointNumber[ 0 ] to find the correct item. So this may be a workaround for now.

[brian428]

@etpinard I was trying out the new version of Plotly with this fix. Looking at your Codepen, I can see that it works for simple X/Y/Z arrays. But unfortunately, it still lacks custom data and shows 2D array for pointNumber when using a 2D array for the Z values. https://codepen.io/brian428/pen/eYNqgXE?editors=0010

[archmoj]

@etpinard I was trying out the new version of Plotly with this fix. Looking at your Codepen, I can see that it works for simple X/Y/Z arrays. But unfortunately, it still lacks custom data and shows 2D array for pointNumber when using a 2D array for the Z values. https://codepen.io/brian428/pen/eYNqgXE?editors=0010

@antoinerg would you mind having a look at this?

[nicolaskruchten]

As far as I can tell, customdata is working in heatmap, but it must have the same shape as z: https://codepen.io/nicolaskruchten/pen/yLYLMRX?editors=0010

[brian428]

Even in that case, the pointNumber, pointIndex, etc. are 2D arrays rather than an integer. https://codepen.io/brian428/pen/RwWwgRL?editors=0010

Is this actually the intended behavior?

[Wes-Kuegler]

@brian428 I've found the same, but I'm running into an issue where I have large 2D data for z, but only a 1D array for customdata labels. I want to apply customdata strings to entire "rows" in z, not each element. For example, I have customdata=["a", "b," "c"] and I want to apply 'b' to each of z[2][x]. The workaround I'm using is to create a new array of the same length as z[x].length for each index in customdata, and copy the desired string z[x].length times into it. It works, but it's not performant at all. Support for mapping 1-dimensional customdata arrays to 2-dimensional z arrays in hovertemplate would be awesome.

[naten7k]

I know this issue is closed, but I have the same issue as @Wes-Kuegler -- I have a 1,000 x 100,000 matrix and a length-1000 customdata that i'd like to apply row-wise. If I use @Wes-Kuegler's workaround, my filesizes and load times become really unmanageable. Is this issue (perhaps more of a feature request?) tracked anywhere else? I would be greatly appreciative if there was been (or could be) any work on this!

[alexcjohnson]

@naten7k this is getting to a level of granularity that's pretty tough to envision adding declaratively (though if you have a proposal we'd be happy to consider it), but straightforward to manage imperatively by responding to hover events. If you're doing this in dash, there's a whole component dedicated to this use case: https://dash.plotly.com/dash-core-components/tooltip

[naten7k]

@alexcjohnson yeah, I sort of figured that would be the case. It's tough to imagine how you'd the correspondence when the shape of customdata isn't the same as (or a stack of) z. (Just the same, if anyone smarter than me could figure out how to do it in a not-terribly-confusing manner, it'd be useful!)

I'm not using Dash, so unfortunately that solution doesn't work so well for me. However, I did find a hacky solution that works well for me. It was to (1) turn off hovertext for the heatmap, (2) set hovermode='y' (3) draw invisible horizontal lines on top of the heatmap, and (4) associate the appropriate hovertext with each horizontal line.