Add new handler: `src/handlers/lineargradient.js`

[Raruto]

Preview

Add support for graduated chart profiles colors:

Sample usage:

L.control.Elevation({
  altitude: true,
  distance: true,
  handlers: [ 'Altitude', 'Distance', 'LinearGradient', ],
  linearGradient: {
    attr: 'z',
    path: 'altitude',
    range: { 0.0: '#008800', 0.5: '#ffff00', 1.0: '#ff0000' },
    min: 'elevation_min',
    max: 'elevation_max',
  },
})

Further information:

• Make use of <linearGradient> 👉 when preferCanvas: false
• Make use of CanvasGradient 👉 when preferCanvas: true

Closes: https://github.com/Raruto/leaflet-elevation/issues/251 Partially handles: https://github.com/Raruto/leaflet-elevation/issues/232

[Raruto]

@jtpio it's definitely not perfect (performances ?), but please let me know if you already see any room for improvement.

[hupe13]

do you confirm that this is the patch you proposed in here? 👉 https://github.com/Raruto/leaflet-elevation/issues/232

Yes it works right now on Chrome and Safari.

But this problem still exists on Safari: This is your /examples/leaflet-elevation.html. I set preferCanvas: true,.

[jtpio]

@jtpio it's definitely not perfect (performances ?), but please let me know if you already see any room for improvement.

Thanks @Raruto this is looking pretty good already!

Just a minor note on the screenshot posted above. It looks like the red color should probably be associated with the steeper sections of the elevation graph?

[Raruto]

Feature released in v2.5.0

[jtpio]

Nice thanks @Raruto!