I\'m working with a variation of Bostock\'s Quantile Choropleth.
I\'ve have successfully scaled the projection and integrated my own data. I am also currently filtering
Assuming I understand your ultimate goal is to get even borders of a hovered feature:
Using datum.append(mesh) won't append areas - a mesh "Returns the GeoJSON MultiLineString geometry object representing the mesh for the specified object in the given topology." API documentation. Also, using .append().datum()
would append one feature - hover effects on individual counties would be lost - there are not data bound to features, just one datum bound to one feature. Lastly, the mesh can have odd fill patterns too (see this question). But, a mesh is unnecessary to get modified borders on hover that display as intended.
While the topojson removes identical arcs, every shared arc is represented at least twice in the geojson - but as they are identical they are overlain directly on top of each other. The layering is relative to the order in which the features are imported.
If a boundary is expanded on hover it may fall behind some (or all or none) of the neighboring features because of how the features are layered. This creates odd outline patterns by essentially clipping the feature's outline. This means that only some changes to a county/feature may be visible, depending on feature/element layering.
Try modifying the hover function with d3.select(this).raise()
(new in v4) or use
node.parentNode.appendChild(node);
(v3, where node is the DOM element, not the d3 selection), these will move a feature to the top of the svg (as though they were appended last) - which will allow you to show a feature with edge styling that is not partly covered by any other feature.
See this example using your referenced block (I've placed the state outlines in the same parent node so that raising the hovered county raises the edge above the state boundary too. On mouse out I lower the feature so that the state boundaries are unaffected.