Mapbox ENYO Example

Ejemplo de mapbox con una token de prueba, hay que modificar el token para producción

by EDWIN MAURICIO QUISHPE MALDONADO

HTML

<script src="https://api.tiles.mapbox.com/mapbox.js/v2.1.8/mapbox.js"></script>
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox.js/v2.1.8/mapbox.css">

CSS

body {

                         margin:0;

                         padding:0;

                     }

                     #map {

                         position:absolute;

                         top:0;

                         bottom:0;

                         width:100%;

                     }

                     .map {

                         position:absolute;

                         top:0;

                         bottom:0;

                         width:100%;

                     }

JavaScript

enyo.kind({
    name: 'MapBox',
    kind: 'FittableRows',
    events: {
        onMapCreated: ''
    },
    components: [{
        kind: "onyx.Toolbar",
        components: [{
            kind: "onyx.Button",
            content: "Test"
        }]
    }, {
        fit: true,
        style: "position:relative;",
        components: [{
            tag: 'div',
            id: "map",
            name: 'map',
            classes: 'map',
            allowHtml: true,
            content: "example"
        }]
    }],
    //* @protected
    create: function () {
        this.inherited(arguments);
    },
    rendered: function () {
        this.inherited(arguments);
        this.load();
    },
    load: function () {
        L.mapbox.accessToken = 'pk.eyJ1IjoibWFtaXNobyIsImEiOiJwb1kzeEMwIn0.-Jz8Se_wuJD-mv714o7qOg';
        var map = L.mapbox.map('map', 'mamisho.h68o8hkp').setView([40, -74.50], 9);
    }
});


enyo.kind({
    name: "App",
    kind: "MapBox",
});

new MapBox().renderInto(document.body);