plotly.js icon indicating copy to clipboard operation
plotly.js copied to clipboard

Support for custom marker symbols

Open gatopeich opened this issue 1 month ago • 4 comments

This pull request introduces support for custom markers via functions in Plotly.js scatter plots, allowing users to pass a function directly as the marker.symbol property to define custom SVG marker shapes. The implementation includes updates to the drawing logic, comprehensive documentation, a demo HTML file, and new tests to ensure correct behavior. This feature provides a flexible and user-friendly way to extend marker capabilities beyond the built-in set.

Custom Marker Function Support:

  • Added support for passing custom functions as marker.symbol in scatter plots, enabling users to define custom SVG path markers directly without registration. The drawing logic is updated to handle both functions and traditional symbol identifiers throughout the rendering pipeline. [1] [2] [3] [4]

Documentation and Examples:

  • Introduced a new CUSTOM_MARKER_FUNCTIONS.md file with detailed documentation, usage examples, function signatures, SVG path command explanations, and best practices for custom marker functions.
  • Added a demo HTML file (devtools/custom_marker_demo.html) showcasing how to use custom marker functions in practice, with live examples and code snippets.

Testing:

  • Added new Jasmine tests to verify that custom marker functions work as expected, including support for arrays of functions and mixing custom functions with built-in symbols.

gatopeich avatar Nov 22 '25 06:11 gatopeich

Hello @gatopeich! Before we review this PR, could you please help us understand what use case prompted this change? Ideally, you'd create an issue describing the problem and explaining why it should be fixed.

camdecoster avatar Dec 02 '25 17:12 camdecoster

I've used this professionally over the last few years to plot meaningful icons on top of maps, e.g. pedestrians, cars, directional wind arrows based on data... Copilot was able to recreate the concept but did not produce a meaningful demo.

gatopeich avatar Dec 02 '25 18:12 gatopeich

Let me add some nice example. I also realize that the function could take more inputs that the size... I solved that with scoped lambdas in the past but now we can make it ellegant.

gatopeich avatar Dec 02 '25 18:12 gatopeich

Sounds good. While you're at it, could you double check the test you added? It's failing in CI.

camdecoster avatar Dec 02 '25 18:12 camdecoster