Fix visualization error for PropertyLayers on HexGrids. Add tranpose …

[flucco]

(New pull request that includes just the one commit)

Summary

Fix a visualization error for PropertyLayers on HexGrids where color values were displayed in the wrong places. Add a transpose operation to put the color values in the right order.

Bug / Issue

Issue 2859. I found that when trying to display PropertyLayers on Hexagonal Grids, color values are consistently shown in the wrong places on the grid. The visualizations for hexagonal grids look dramatically different from the visualizations for orthogonal grids. You would expect the visualizations to look similar besides the small differences caused by the hexagonal cell layout.

Implementation

The issue was in the draw_propertylayer function in matplotlib_backend.py. The code for the HexGrid visualization flattened the W x H PropertyLayer data into a 1D array, then matched those values to a collection of hexagonal grid cells arranged in H x W order. The different orders led to incorrect placement of values on the grid.

The one-line fix is to add a transpose operation (.T) before the ravel operation that flattens the data. This creates a 1D array of color values in the correct H x W order. I picked this approach because it's simple and matches the implementation used for orthogonal grids. Now, all cases use a simple transpose operation to adjust the data for graphing purposes.

Testing

I tested this fix in a modified version of the Sugarscape example, described in the issue and available in [this branch] (https://github.com/flucco/mesa/tree/bug_example) of my fork. I used the original sugarscape map, 50x50 modifications of that map which added asymmetrical elements, and modified maps that had varied W x H ratios.

Before the fix, the values aren’t shown in the right places on the grid. Agents should be in white squares due to consumption of resources, but the white squares appear in other locations. Here is the comparison at timestep 1 of Orthogonal and Hexagonal behaviors using the 60x40 grid. (Note: I changed the size of the agents to 7 and alpha to 0.8 as it's easier to see the color values). See also the examples shown in the issue.

Orthogonal:

Hexagonal:

Note the incorrect placement of the color values, as shown by the differences from the orthogonal grid and how the agents are not in white squares. Instead, the white squares that should correspond to the agents appear elsewhere in the grid.

After the fix, the behavior is correct in all cases I tested, and closely resembles the visualization of the original orthogonal model.

Hexagonal after fix:

I tested the fixed code on all the basic tests given and ran the formatting checks just to make sure.

Additional Notes

• It was pointed out that this example doesn't seem to work on Altair but I think this might be due to unrelated issues.

[github-actions]

Performance benchmarks:

Model	Size	Init time [95% CI]	Run time [95% CI]
BoltzmannWealth	small	🔵 +3.5% [+2.8%, +4.2%]	🔴 +4.1% [+3.9%, +4.2%]
BoltzmannWealth	large	🔵 +0.4% [-0.2%, +1.2%]	🔵 +2.3% [+0.8%, +3.6%]
Schelling	small	🔵 +1.3% [+1.1%, +1.5%]	🔵 +1.8% [+1.6%, +2.0%]
Schelling	large	🔵 +0.7% [+0.3%, +1.1%]	🔵 +3.4% [+2.7%, +4.0%]
WolfSheep	small	🔵 +1.5% [+1.2%, +1.8%]	🔴 +5.8% [+5.6%, +6.0%]
WolfSheep	large	🔵 +0.4% [-0.0%, +0.8%]	🔴 +4.1% [+3.6%, +4.7%]
BoidFlockers	small	🔵 +0.5% [-0.1%, +1.2%]	🔵 +0.8% [+0.6%, +1.0%]
BoidFlockers	large	🔵 +0.4% [+0.0%, +0.7%]	🔵 +0.5% [+0.3%, +0.8%]

[Sahil-Chhoker]

@flucco, Thanks for this!

[EwoutH]

@Sahil-Chhoker this can be merged, right?

Be sure to add a label to the PR so it ends up in the right place in the release notes (“bug”) in this case.

[Sahil-Chhoker]

@EwoutH Yes, this PR can be merged, do you want me to do it?

[EwoutH]

Yes, go ahead!