# mapbox-plugins

Customized Mapbox plugins, including game control, canvasOverlayer, scene animation

https://alex2wong.github.io/mapbox-plugins/

Note: pls visit all demo with HTTPS..

canvas line style which can be integrate to any map/chart lib.

## Online demo

demo title |
--- | ---
Sprite track DEMO | view code
Custom dom overlay DEMO | view code
R-tree search (5000 rectangles) DEMO | view code
Global Wind Layer. render 1w point animation with Canvas | view code
Integrate with Chart.js | view code
Glow animation | view code
(NEW) Cool Route Animation | view code

## run locally

> npm install

> npm start

visit from localhost:8080/examples/

## how to use

plugins provide canvasOverlay, domOverlay ,Sprite, gameControl extension etc. for example:

    // create a CanvasOverlayer on Mapbox map instance..
    var canvasLayer = new Mapbox.CanvasOverlayer({
        map: map,
        shadow: false,
        keepTrack: true,
        blurWidth: 4
    });

    // create a Drone inherites Sprite Class
    var drone = new Mapbox.Drone({
        direction: 45,
        icon: "https://alex2wong.github.io/mapbox-plugins/assets/tri2.png"
    });

    // add keyboard control to Sprite.
    Mapbox.Controllers.gameControl(drone);
    function update(){
        drone.updateStatus();
        // render drone on canvasLayer.
        canvasLayer.redraw([drone]);
        requestAnimationFrame(update);
    }
    update();

### Any ☆Star, Enhancement and PR are welcome :)