Having the ability in mesh3d to use a variable to color the mesh via the ‘intensity’ attribute is tremendously useful. I am struggling, however, to figure out how to (1) link the colorbar tick labels to the ‘intensity’ variable rather than the ‘z’ value and (2) view the intensity values via hover events.
In the example below for instance, the z variable ranges in value from 1 to 5 but the intensity variable ranges from 0 to 36. Notice that the color displayed on the plot clearly differs from the z value given that it correctly reflects the values that I linked to the ‘intensity’ attribute. Nonetheless for some reason that I do not understand the colorbar ticks show the z value range rather than that of the intensity variable that is used to color the mesh.
An additional thing that I have been unable to figure out is how to get the hover tooltip to show the intensity value as well as the x, y, and z values. Setting ‘hoverinfo’ to ‘all’ doesn’t seem to provide this capability.
A huge thanks in advance to anyone who can help me figure out how to solve these problems!
For reference, here is the JavaScript code that I used to create the plot:
Mesh 3d Example 2<body>
<div id='myDiv'></div>
<script>
var x = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 1, 2, 3, 4, 5];
var y = [1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5];
var z = [5, 5, 5, 5, 5, 5, 4, 4, 4, 4, 5, 4, 3, 3, 3, 5, 4, 3, 2, 2, 5, 4, 3, 2, 1];
var color_variable = [14.14213562, 10, 14.14213562, 22.36067977, 31.6227766, 10, 0, 10, 20, 30, 14.14213562, 10, 14.14213562, 22.36067977, 31.6227766, 22.36067977, 20, 22.36067977, 28.28427125, 36.05551275, 31.6227766, 30, 31.6227766, 36.05551275, 42.42640687];
var trace1 = {
x: x,
y: y,
z: z,
intensity: color_variable,
type: 'mesh3d',
colorscale: 'Jet',
};
var data = [trace1];
var layout = {
title: '<b>color by variable other than z</b>',
xaxis: { title: '<b>x</b>' },
yaxis: { title: '<b>y</b>' },
zaxis: { title: '<b>z</b>' },
width: 700,
height: 700,
hoverinfo: 'all'
};
Plotly.newPlot('myDiv', data, layout);
</script>
</body>