https://github.com/danwild/leafletjs-canvas-overlay

Repo for npm wrapper of https://gist.github.com/Sumbera/11114288
https://github.com/danwild/leafletjs-canvas-overlay

Last synced: about 1 year ago
JSON representation

Repo for npm wrapper of https://gist.github.com/Sumbera/11114288

• Host: GitHub
• URL: https://github.com/danwild/leafletjs-canvas-overlay
• Owner: danwild
• License: other
• Created: 2016-06-27T01:23:38.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2016-07-14T04:00:53.000Z (almost 10 years ago)
• Last Synced: 2025-04-17T15:49:46.220Z (about 1 year ago)
• Language: JavaScript
• Homepage: https://blog.sumbera.com/2014/04/20/leaflet-canvas/
• Size: 220 KB
• Stars: 4
• Watchers: 2
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.TXT

Awesome Lists containing this project

README

          
Leaflet Full view Canvas Overlay - straightforward full screen canvas overlay that calls custom user function for drawing.

Mostly extracted from [here](https://github.com/Leaflet/Leaflet.heat) added resize and few other parameters for callback

Compare to same data SVG rendering [here](http://bl.ocks.org/Sumbera/7e8e57368175a1433791)

		//Example:

		L.canvasOverlay()

		   .params({data: points})     // optional add any custom data that will be passed to draw function

	           .drawing(drawingOnCanvas)   // set drawing function

	           .addTo(leafletMap);         // add this layer to leaflet map

	            

		//Custom drawing function:

			function drawingOnCanvas(canvasOverlay, params) {

		            var ctx = params.canvas.getContext('2d');

		            params.options.data.map(function (d, i) {

		              // canvas drawing goes here

		            });

		        };

		        

		// parameters passed to custom draw function :

		 {

                                    canvas   : ,

                                    bounds   : 

                                    size     : ,

                                    zoomScale: ,

                                    zoom     : ,

                                    options  : 

                 };

Other useful full view  Leaflet Canvas sources here:

- [leaflet.heat](https://github.com/Leaflet/Leaflet.heat)

- [Full Canvas] (https://github.com/cyrilcherian/Leaflet-Fullcanvas)

- [CartoDb Leaflet.Canvas] (https://github.com/CartoDB/Leaflet.CanvasLayer)