Non scaling stroke on zoom.

[mdtusz]

This only applies when using zoomScroll, but we should add vector-effect="non-scaling-stroke" to scatter lines so they don't embiggen and enshrinken too too much.

E.g. when scrolling on @rreusser 's example here

[rreusser]

Correct me if I'm wrong, is it's not (reasonably) possible to apply that to markers, is it? Just paths? Or you can use actual markers but then they all have to be the same etc. so that for plotly this can really only be used on paths?

[mdtusz]

As far as I know, it only works on paths. We could counteract marker size changes easily enough as well though - just need to set r = radius/scale if I'm not mistaken.

[rreusser]

SVG elements get redrawn all the time, so not sure there's a meaningful performance overhead to scaling points if the transform is just computed to a string once and applied a bunch—thought it's a bit ugly.

Added vector-effect: non-scaling-stroke; in the browser and appears to work fine, though obviously disappears as soon as you pause and it's redrawn. It's not immediately apparent to me that this would cause other problems since it's only present until it's redrawn—which only really happens on scroll zoom and soon-to-be transitions, unless I'm mistaken.

[rreusser]

Is this the spot for it? https://github.com/plotly/plotly.js/blob/master/src/components/drawing/index.js#L84

[mdtusz]

I think that would do it - I was testing in scatter/plot.js, but drawing may have a nicer deeper effect.

[rreusser]

Pardon the hacky informality, but deployed a quick PoC with it added on that line here: https://rreusser.github.io/plotly-expression-transform/

that is,

drawing.lineGroupStyle = function(s, lw, lc, ld) {
    s.style('fill', 'none')
    .style('vector-effect', 'non-scaling-stroke')
    .each(function(d) {

A grep shows it's used in the following places:

src/components/colorbar/draw.js
390:                    .call(Drawing.lineGroupStyle,

src/components/drawing/index.js
83:drawing.lineGroupStyle = function(s, lw, lc, ld) {

src/components/legend/style.js
75:    line.call(Drawing.lineGroupStyle);

src/traces/contour/style.js
39:                .call(Drawing.lineGroupStyle,

src/traces/scatter/style.js
34:        .call(Drawing.lineGroupStyle);

src/traces/scattergeo/plot.js
231:    // GeoJSON calc data is incompatible with Drawing.lineGroupStyle

[rreusser]

None of the other uses include transforms on the parent, I think, so I think it's relatively innocuous based on current usage. (Too bad point scaling can't be handled in parallel though.)

Although maybe it is better to scope it to scatter (and contour?) traces though… If it's not used elsewhere then it's not really necessary to set it elsewhere, even if it has no effect.