Leaflet.Canvas-Flowmap-Layer icon indicating copy to clipboard operation
Leaflet.Canvas-Flowmap-Layer copied to clipboard

Change thickness of lines proportional to flow quantities

Open osper66 opened this issue 3 years ago • 2 comments

Any idea?

Thanks for advance.

osper66 avatar Sep 24 '20 09:09 osper66

@osper66 is this what you are looking for? We have a demo that has different line widths (and colors) based on data attributes.

https://jwasilgeo.github.io/Leaflet.Canvas-Flowmap-Layer/docs/class-breaks-symbology/

https://github.com/jwasilgeo/Leaflet.Canvas-Flowmap-Layer/blob/master/docs/class-breaks-symbology/index.html#L94-L137

jwasilgeo avatar Feb 05 '21 15:02 jwasilgeo

If CanvasFlowmapLayer.js's destinationFeature in line:186's property has flow value(population, migration etc.) , change g this._animateCanvasLineSymbol(ctx, symbol, screenOriginPoint, screenDestinationPoint) in line:642 to this._animateCanvasLineSymbol(ctx, symbol, screenOriginPoint, screenDestinationPoint, lineWidths[feature.properties.population) where lineWidths are given by some scaling rule according to population value and finally change _animateCanvasLineSymbol: function(ctx, symbolObject, screenOriginPoint, screenDestinationPoint, lineWidth) in line:693 and ctx.lineWidth = lineWidth in line:695.

osper66 avatar Feb 07 '21 13:02 osper66