Raruto / leaflet-elevation

Leaflet plugin that allows to add elevation profiles using d3js
GNU General Public License v3.0
255 stars 85 forks source link

Is it possible to use custom waypoint icons for the elevation chart? #230

Closed JonasDoe closed 1 year ago

JonasDoe commented 1 year ago

Subject of the issue

From the examples and the documentation I understand that I can create custom waypoint icons with the wptIcons property. But that only seems to affect the displayed map, not the elevation chart, which only features dots with texts. I'm not sure whether I'm missing something, though.

Expected behaviour

In case I'm not missing some option, a flag, e.g. type icons='MAP'|'CHART'|'BOTH' would be nice, if it doesn't conflict with any other chart specific settings.

Raruto commented 1 year ago

Hi @JonasDoe

No, this is not a feature available out of the box, also because the wptIcons are nothing more than instances of leaflet icons:

https://github.com/Raruto/leaflet-elevation/blob/868179234d8e9b8f7beaea57d0e34d8bd79a2622/src/options.js#L55-L62

Instead, svg "points" are created manually in the elevation chart within this library with the aid of d3.js:

https://github.com/Raruto/leaflet-elevation/blob/868179234d8e9b8f7beaea57d0e34d8bd79a2622/src/components/d3.js#L430-L487

Anyway, with the right javascript knowledge it shouldn't be too much difficult to alter the current code in order to write some dedicated functions for this purpose (eg. monkey patching some built-in from L.Control.Elevation.*).

As a starting point, If you don't know where to start looking, you can also check out leaflet-elevation_dynamic-runner.html source code:

https://github.com/Raruto/leaflet-elevation/blob/868179234d8e9b8f7beaea57d0e34d8bd79a2622/examples/leaflet-elevation_dynamic-runner.html#L47-L85

Anyway, keep in mind that:

👋 Raruto

JonasDoe commented 1 year ago

Alright, thank you for the directions!