Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Socket
Sign inDemoInstall

ol-mapbox-style

Package Overview
Dependencies
Maintainers
2
Versions
170
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ol-mapbox-style - npm Package Compare versions

Comparing version 3.0.0-beta.3 to 3.0.0-beta.4

dist/olms.js

49

__tests__/test.js
import 'babel-polyfill';
import should from 'should/as-function';
import 'should-approximately-deep';
import {applyBackground, applyStyle, apply} from '../';
import Map from 'ol/CanvasMap';
import {applyBackground, applyStyle, apply, getLayer, getSource} from '../';
import Map from 'ol/Map';
import TileSource from 'ol/source/Tile';

@@ -65,6 +65,6 @@ import VectorSource from 'ol/source/Vector';

setTimeout(function() {
map.getLayers().once('add', function() {
should(map.getLayers().item(0).getStyle()).be.a.Function();
done();
}, 200);
});
});

@@ -92,3 +92,3 @@

should(osm.getSource().getAttributions()()[0]).equal(
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors.');
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors.');
should(wms.getSource().getTileGrid().getTileSize()).eql(256);

@@ -188,3 +188,3 @@ should(wms.getSource().getTileGrid().getMaxZoom()).eql(12);

it('handles visibility for raster layers', function() {
it('handles visibility for raster layers', function(done) {
var context = {

@@ -212,6 +212,41 @@ 'version': 8,

var map = apply(target, context);
should(map.getLayers().item(0).get('visible')).be.false();
map.getLayers().once('add', function() {
should(map.getLayers().item(0).get('visible')).be.false();
done();
});
});
});
describe('getLayer', function() {
var target;
beforeEach(function() {
target = document.createElement('div');
});
it('returns a layer', function(done) {
var map = apply(target, brightV9);
map.once('change:mapbox-style', function() {
should(getLayer(map, 'landuse_park')).be.an.instanceOf(VectorTileLayer);
done();
});
});
});
describe('getSource', function() {
var target;
beforeEach(function() {
target = document.createElement('div');
});
it('returns a source', function(done) {
var map = apply(target, brightV9);
map.once('change:mapbox-style', function() {
should(getSource(map, 'mapbox')).be.an.instanceOf(VectorTileSource);
done();
});
});
});
});

54

env-setup.js

@@ -8,30 +8,34 @@ // http://paulirish.com/2011/requestanimationframe-for-smart-animating/

(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame']
|| window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
timeToCall);
lastTime = currTime + timeToCall;
return id;
};
if (!window.cancelAnimationFrame)
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] ||
window[vendors[x] + 'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame) {
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() {
callback(currTime + timeToCall);
},
timeToCall);
lastTime = currTime + timeToCall;
return id;
};
}
if (!window.cancelAnimationFrame) {
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}
}());
(function() {
var canvasBindings = require("canvas/lib/bindings");
window.CanvasGradient = canvasBindings.CanvasGradient;
window.CanvasPattern = canvasBindings.CanvasPattern;
var canvasBindings = require('canvas/lib/bindings');
window.CanvasGradient = canvasBindings.CanvasGradient;
window.CanvasPattern = canvasBindings.CanvasPattern;
}());

@@ -1,1 +0,1038 @@

{"zoom": 6, "center": [5, 5], "layers": [{"source": "points", "type": "symbol", "id": "points", "paint": {"icon-image": {"property": "cat", "type": "categorical", "stops": [[1, "accommodation_camping"], [2, "amenity_firestation"]]}}}], "name": "QGIS project", "sources": {"points": {"data": {"type":"FeatureCollection","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:OGC:1.3:CRS84"}},"features":[{"type":"Feature","properties":{"n":2,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,0.5]}},{"type":"Feature","properties":{"n":3,"cat":2},"geometry":{"type":"Point","coordinates":[0.5,1.5]}},{"type":"Feature","properties":{"n":4,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,2.5]}},{"type":"Feature","properties":{"n":5,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,3.5]}},{"type":"Feature","properties":{"n":6,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,4.5]}},{"type":"Feature","properties":{"n":7,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,5.5]}},{"type":"Feature","properties":{"n":8,"cat":2},"geometry":{"type":"Point","coordinates":[0.5,6.5]}},{"type":"Feature","properties":{"n":9,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,7.5]}},{"type":"Feature","properties":{"n":10,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,8.5]}},{"type":"Feature","properties":{"n":11,"cat":1},"geometry":{"type":"Point","coordinates":[0.5,9.5]}},{"type":"Feature","properties":{"n":12,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,0.5]}},{"type":"Feature","properties":{"n":13,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,1.5]}},{"type":"Feature","properties":{"n":14,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,2.5]}},{"type":"Feature","properties":{"n":15,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,3.5]}},{"type":"Feature","properties":{"n":16,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,4.5]}},{"type":"Feature","properties":{"n":17,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,5.5]}},{"type":"Feature","properties":{"n":18,"cat":2},"geometry":{"type":"Point","coordinates":[1.5,6.5]}},{"type":"Feature","properties":{"n":19,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,7.5]}},{"type":"Feature","properties":{"n":20,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,8.5]}},{"type":"Feature","properties":{"n":21,"cat":1},"geometry":{"type":"Point","coordinates":[1.5,9.5]}},{"type":"Feature","properties":{"n":22,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,0.5]}},{"type":"Feature","properties":{"n":23,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,1.5]}},{"type":"Feature","properties":{"n":24,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,2.5]}},{"type":"Feature","properties":{"n":25,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,3.5]}},{"type":"Feature","properties":{"n":26,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,4.5]}},{"type":"Feature","properties":{"n":27,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,5.5]}},{"type":"Feature","properties":{"n":28,"cat":1},"geometry":{"type":"Point","coordinates":[2.5,6.5]}},{"type":"Feature","properties":{"n":29,"cat":1},"geometry":{"type":"Point","coordinates":[2.5,7.5]}},{"type":"Feature","properties":{"n":30,"cat":1},"geometry":{"type":"Point","coordinates":[2.5,8.5]}},{"type":"Feature","properties":{"n":31,"cat":2},"geometry":{"type":"Point","coordinates":[2.5,9.5]}},{"type":"Feature","properties":{"n":32,"cat":2},"geometry":{"type":"Point","coordinates":[3.5,0.5]}},{"type":"Feature","properties":{"n":33,"cat":2},"geometry":{"type":"Point","coordinates":[3.5,1.5]}},{"type":"Feature","properties":{"n":34,"cat":2},"geometry":{"type":"Point","coordinates":[3.5,2.5]}},{"type":"Feature","properties":{"n":35,"cat":1},"geometry":{"type":"Point","coordinates":[3.5,3.5]}},{"type":"Feature","properties":{"n":36,"cat":1},"geometry":{"type":"Point","coordinates":[3.5,4.5]}},{"type":"Feature","properties":{"n":37,"cat":2},"geometry":{"type":"Point","coordinates":[3.5,5.5]}},{"type":"Feature","properties":{"n":38,"cat":2},"geometry":{"type":"Point","coordinates":[3.5,6.5]}},{"type":"Feature","properties":{"n":39,"cat":1},"geometry":{"type":"Point","coordinates":[3.5,7.5]}},{"type":"Feature","properties":{"n":40,"cat":1},"geometry":{"type":"Point","coordinates":[3.5,8.5]}},{"type":"Feature","properties":{"n":41,"cat":1},"geometry":{"type":"Point","coordinates":[3.5,9.5]}},{"type":"Feature","properties":{"n":42,"cat":2},"geometry":{"type":"Point","coordinates":[4.5,0.5]}},{"type":"Feature","properties":{"n":43,"cat":2},"geometry":{"type":"Point","coordinates":[4.5,1.5]}},{"type":"Feature","properties":{"n":44,"cat":1},"geometry":{"type":"Point","coordinates":[4.5,2.5]}},{"type":"Feature","properties":{"n":45,"cat":1},"geometry":{"type":"Point","coordinates":[4.5,3.5]}},{"type":"Feature","properties":{"n":46,"cat":2},"geometry":{"type":"Point","coordinates":[4.5,4.5]}},{"type":"Feature","properties":{"n":47,"cat":2},"geometry":{"type":"Point","coordinates":[4.5,5.5]}},{"type":"Feature","properties":{"n":48,"cat":1},"geometry":{"type":"Point","coordinates":[4.5,6.5]}},{"type":"Feature","properties":{"n":49,"cat":1},"geometry":{"type":"Point","coordinates":[4.5,7.5]}},{"type":"Feature","properties":{"n":50,"cat":2},"geometry":{"type":"Point","coordinates":[4.5,8.5]}},{"type":"Feature","properties":{"n":51,"cat":2},"geometry":{"type":"Point","coordinates":[4.5,9.5]}},{"type":"Feature","properties":{"n":52,"cat":2},"geometry":{"type":"Point","coordinates":[5.5,0.5]}},{"type":"Feature","properties":{"n":53,"cat":1},"geometry":{"type":"Point","coordinates":[5.5,1.5]}},{"type":"Feature","properties":{"n":54,"cat":2},"geometry":{"type":"Point","coordinates":[5.5,2.5]}},{"type":"Feature","properties":{"n":55,"cat":1},"geometry":{"type":"Point","coordinates":[5.5,3.5]}},{"type":"Feature","properties":{"n":56,"cat":1},"geometry":{"type":"Point","coordinates":[5.5,4.5]}},{"type":"Feature","properties":{"n":57,"cat":2},"geometry":{"type":"Point","coordinates":[5.5,5.5]}},{"type":"Feature","properties":{"n":58,"cat":2},"geometry":{"type":"Point","coordinates":[5.5,6.5]}},{"type":"Feature","properties":{"n":59,"cat":2},"geometry":{"type":"Point","coordinates":[5.5,7.5]}},{"type":"Feature","properties":{"n":60,"cat":2},"geometry":{"type":"Point","coordinates":[5.5,8.5]}},{"type":"Feature","properties":{"n":61,"cat":1},"geometry":{"type":"Point","coordinates":[5.5,9.5]}},{"type":"Feature","properties":{"n":62,"cat":2},"geometry":{"type":"Point","coordinates":[6.5,0.5]}},{"type":"Feature","properties":{"n":63,"cat":1},"geometry":{"type":"Point","coordinates":[6.5,1.5]}},{"type":"Feature","properties":{"n":64,"cat":2},"geometry":{"type":"Point","coordinates":[6.5,2.5]}},{"type":"Feature","properties":{"n":65,"cat":2},"geometry":{"type":"Point","coordinates":[6.5,3.5]}},{"type":"Feature","properties":{"n":66,"cat":1},"geometry":{"type":"Point","coordinates":[6.5,4.5]}},{"type":"Feature","properties":{"n":67,"cat":2},"geometry":{"type":"Point","coordinates":[6.5,5.5]}},{"type":"Feature","properties":{"n":68,"cat":2},"geometry":{"type":"Point","coordinates":[6.5,6.5]}},{"type":"Feature","properties":{"n":69,"cat":1},"geometry":{"type":"Point","coordinates":[6.5,7.5]}},{"type":"Feature","properties":{"n":70,"cat":1},"geometry":{"type":"Point","coordinates":[6.5,8.5]}},{"type":"Feature","properties":{"n":71,"cat":2},"geometry":{"type":"Point","coordinates":[6.5,9.5]}},{"type":"Feature","properties":{"n":72,"cat":2},"geometry":{"type":"Point","coordinates":[7.5,0.5]}},{"type":"Feature","properties":{"n":73,"cat":1},"geometry":{"type":"Point","coordinates":[7.5,1.5]}},{"type":"Feature","properties":{"n":74,"cat":2},"geometry":{"type":"Point","coordinates":[7.5,2.5]}},{"type":"Feature","properties":{"n":75,"cat":2},"geometry":{"type":"Point","coordinates":[7.5,3.5]}},{"type":"Feature","properties":{"n":76,"cat":1},"geometry":{"type":"Point","coordinates":[7.5,4.5]}},{"type":"Feature","properties":{"n":77,"cat":1},"geometry":{"type":"Point","coordinates":[7.5,5.5]}},{"type":"Feature","properties":{"n":78,"cat":2},"geometry":{"type":"Point","coordinates":[7.5,6.5]}},{"type":"Feature","properties":{"n":79,"cat":1},"geometry":{"type":"Point","coordinates":[7.5,7.5]}},{"type":"Feature","properties":{"n":80,"cat":1},"geometry":{"type":"Point","coordinates":[7.5,8.5]}},{"type":"Feature","properties":{"n":81,"cat":2},"geometry":{"type":"Point","coordinates":[7.5,9.5]}},{"type":"Feature","properties":{"n":82,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,0.5]}},{"type":"Feature","properties":{"n":83,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,1.5]}},{"type":"Feature","properties":{"n":84,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,2.5]}},{"type":"Feature","properties":{"n":85,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,3.5]}},{"type":"Feature","properties":{"n":86,"cat":1},"geometry":{"type":"Point","coordinates":[8.5,4.5]}},{"type":"Feature","properties":{"n":87,"cat":1},"geometry":{"type":"Point","coordinates":[8.5,5.5]}},{"type":"Feature","properties":{"n":88,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,6.5]}},{"type":"Feature","properties":{"n":89,"cat":1},"geometry":{"type":"Point","coordinates":[8.5,7.5]}},{"type":"Feature","properties":{"n":90,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,8.5]}},{"type":"Feature","properties":{"n":91,"cat":2},"geometry":{"type":"Point","coordinates":[8.5,9.5]}},{"type":"Feature","properties":{"n":92,"cat":1},"geometry":{"type":"Point","coordinates":[9.5,0.5]}},{"type":"Feature","properties":{"n":93,"cat":2},"geometry":{"type":"Point","coordinates":[9.5,1.5]}},{"type":"Feature","properties":{"n":94,"cat":1},"geometry":{"type":"Point","coordinates":[9.5,2.5]}},{"type":"Feature","properties":{"n":95,"cat":1},"geometry":{"type":"Point","coordinates":[9.5,3.5]}},{"type":"Feature","properties":{"n":96,"cat":2},"geometry":{"type":"Point","coordinates":[9.5,4.5]}},{"type":"Feature","properties":{"n":97,"cat":1},"geometry":{"type":"Point","coordinates":[9.5,5.5]}},{"type":"Feature","properties":{"n":98,"cat":2},"geometry":{"type":"Point","coordinates":[9.5,6.5]}},{"type":"Feature","properties":{"n":99,"cat":2},"geometry":{"type":"Point","coordinates":[9.5,7.5]}},{"type":"Feature","properties":{"n":100,"cat":2},"geometry":{"type":"Point","coordinates":[9.5,8.5]}},{"type":"Feature","properties":{"n":101,"cat":2},"geometry":{"type":"Point","coordinates":[9.5,9.5]}}]}, "type": "geojson"}}, "version": 8, "glyphs": "mapbox://fonts/mapbox/{fontstack}/{range}.pbf", "sprite": "./sprites"}
{
"zoom": 6,
"center": [5, 5],
"layers": [{
"source": "points",
"type": "symbol",
"id": "points",
"layout": {
"icon-image": {
"property": "cat",
"type": "categorical",
"stops": [
[1, "accommodation_camping"],
[2, "amenity_firestation"]
]
}
}
}],
"name": "QGIS project",
"sources": {
"points": {
"data": {
"type": "FeatureCollection",
"crs": {
"type": "name",
"properties": {
"name": "urn:ogc:def:crs:OGC:1.3:CRS84"
}
},
"features": [{
"type": "Feature",
"properties": {
"n": 2,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 3,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 4,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 5,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 6,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 7,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 8,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 9,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 10,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 11,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [0.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 12,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 13,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 14,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 15,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 16,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 17,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 18,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 19,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 20,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 21,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [1.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 22,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 23,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 24,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 25,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 26,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 27,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 28,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 29,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 30,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 31,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [2.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 32,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 33,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 34,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 35,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 36,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 37,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 38,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 39,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 40,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 41,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [3.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 42,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 43,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 44,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 45,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 46,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 47,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 48,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 49,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 50,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 51,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [4.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 52,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 53,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 54,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 55,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 56,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 57,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 58,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 59,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 60,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 61,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [5.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 62,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 63,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 64,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 65,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 66,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 67,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 68,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 69,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 70,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 71,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [6.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 72,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 73,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 74,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 75,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 76,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 77,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 78,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 79,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 80,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 81,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [7.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 82,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 83,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 84,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 85,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 86,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 87,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 88,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 89,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 90,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 91,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [8.5, 9.5]
}
}, {
"type": "Feature",
"properties": {
"n": 92,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 0.5]
}
}, {
"type": "Feature",
"properties": {
"n": 93,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 1.5]
}
}, {
"type": "Feature",
"properties": {
"n": 94,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 2.5]
}
}, {
"type": "Feature",
"properties": {
"n": 95,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 3.5]
}
}, {
"type": "Feature",
"properties": {
"n": 96,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 4.5]
}
}, {
"type": "Feature",
"properties": {
"n": 97,
"cat": 1
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 5.5]
}
}, {
"type": "Feature",
"properties": {
"n": 98,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 6.5]
}
}, {
"type": "Feature",
"properties": {
"n": 99,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 7.5]
}
}, {
"type": "Feature",
"properties": {
"n": 100,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 8.5]
}
}, {
"type": "Feature",
"properties": {
"n": 101,
"cat": 2
},
"geometry": {
"type": "Point",
"coordinates": [9.5, 9.5]
}
}]
},
"type": "geojson"
}
},
"version": 8,
"glyphs": "mapbox://fonts/mapbox/{fontstack}/{range}.pbf",
"sprite": "./sprites"
}

@@ -13,3 +13,3 @@ /*

import {createXYZ} from 'ol/tilegrid';
import CanvasMap from 'ol/CanvasMap';
import Map from 'ol/Map';
import GeoJSON from 'ol/format/GeoJSON';

@@ -105,6 +105,7 @@ import MVT from 'ol/format/MVT';

* a relative path is used with the `"sprite"` property of the style.
* @param {Array<number>} [resolutions=undefined] Resolutions for mapping resolution to zoom level.
* @return {Promise} Promise which will be resolved when the style can be used
* for rendering.
*/
export function applyStyle(layer, glStyle, source, path) {
export function applyStyle(layer, glStyle, source, path, resolutions) {
return new Promise(function(resolve, reject) {

@@ -153,3 +154,3 @@

if (!style && (!glStyle.sprite || spriteData) && (!availableFonts || availableFonts.length > 0)) {
style = applyStyleFunction(layer, glStyle, source, undefined, spriteData, spriteImageUrl, availableFonts);
style = applyStyleFunction(layer, glStyle, source, resolutions, spriteData, spriteImageUrl, availableFonts);
resolve();

@@ -171,3 +172,3 @@ } else if (style) {

} catch (e) {
window.setTimeout(function() {
setTimeout(function() {
reject(e);

@@ -425,2 +426,3 @@ }, 0);

finalizeLayer(layer);
map.set('mapbox-style', glStyle);
}

@@ -447,2 +449,5 @@

*
* The map returned by this function will have an additional `mapbox-style`
* property which holds the Mapbox Style object.
*
* @param {ol.Map|HTMLElement|string} map Either an existing OpenLayers Map

@@ -468,4 +473,4 @@ * instance, or a HTML element, or the id of a HTML element that will be the

if (!(map instanceof CanvasMap)) {
map = new CanvasMap({
if (!(map instanceof Map)) {
map = new Map({
target: map

@@ -501,5 +506,40 @@ });

} else {
processStyle(style, map);
setTimeout(function() {
processStyle(style, map);
}, 0);
}
return map;
}
/**
* Get the OpenLayers layer instance that contains the provided Mapbox Style
* `layer`. Note that multiple Mapbox Style layers are combined in a single
* OpenLayers layer instance when they use the same Mapbox Style `source`.
* @param {ol.Map} map OpenLayers Map.
* @param {string} layerId Mapbox Style layer id.
* @return {ol.layer.Layer} layer OpenLayers layer instance.
*/
export function getLayer(map, layerId) {
const layers = map.getLayers().getArray();
for (let i = 0, ii = layers.length; i < ii; ++i) {
if (layers[i].get('mapbox-layers').indexOf(layerId) !== -1) {
return layers[i];
}
}
}
/**
* Get the OpenLayers source instance for the provided Mapbox Style `source`.
* @param {ol.Map} map OpenLayers Map.
* @param {string} sourceId Mapbox Style source id.
* @return {ol.layer.Layer} layer OpenLayers layer instance.
*/
export function getSource(map, sourceId) {
const layers = map.getLayers().getArray();
for (let i = 0, ii = layers.length; i < ii; ++i) {
const source = layers[i].getSource();
if (layers[i].get('mapbox-source').indexOf(sourceId) !== -1) {
return source;
}
}
}
{
"name": "ol-mapbox-style",
"version": "3.0.0-beta.3",
"version": "3.0.0-beta.4",
"description": "Create OpenLayers maps from Mapbox Style objects",

@@ -64,6 +64,6 @@ "main": "index.js",

"start": "webpack-dev-server --config ./webpack.config.js",
"prepublish": "npm run doc",
"build": "webpack-cli --config ./webpack.config.js",
"prepare": "npm run doc && npm run build",
"build": "webpack-cli --config ./webpack.config.olms.js",
"doc": "documentation readme -s API index.js",
"lint": "eslint __test__ index.js webpack.config.js",
"lint": "eslint __test__ example *.js",
"pretest": "npm run lint",

@@ -88,2 +88,4 @@ "test": "jest",

"canvas": "^1.6.8",
"copy-webpack-plugin": "^4.5.1",
"css-loader": "^0.28.11",
"deep-freeze": "0.0.1",

@@ -93,2 +95,3 @@ "documentation": "^4.0.0-rc.1",

"eslint-config-openlayers": "^7.0.0",
"html-webpack-plugin": "^3.1.0",
"isomorphic-fetch": "^2.2.1",

@@ -101,6 +104,7 @@ "jest": "^20.0.4",

"nock": "^9.2.3",
"ol": "^5.0.0-beta.9",
"ol": "^5.0.0-beta.11",
"regenerator-runtime": "^0.11.1",
"should": "^11.2.1",
"should-approximately-deep": "^1.1.0",
"style-loader": "^0.20.3",
"webpack": "^4.1.1",

@@ -107,0 +111,0 @@ "webpack-cli": "^2.0.12",

@@ -24,2 +24,25 @@ # ol-mapbox-style

To create a style function for individual OpenLayers vector or vector tile layers, use the `stylefunction` module:
```js
import stylefuction from 'ol-mapbox-style/stylefunction';
// OpenLayers imports from https://npmjs.com/package/ol
import VectorLayer from 'ol/layer/Vector';
import VectorSource from 'ol/source/Vector';
import GeoJSON from 'ol/format/GeoJSON';
var layer = new VectorLayer({
source: new VectorSource({
format: new GeoJSON(),
url: 'data/states.geojson'
})
});
fetch('data/states.json').then(function(response) {
response.json().then(function(glStyle) {
stylefunction(layer, glStyle, 'states');
});
});
```
## API

@@ -47,2 +70,3 @@

a relative path is used with the `"sprite"` property of the style. (optional, default `undefined`)
- `resolutions` **[Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)&lt;[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)>** Resolutions for mapping resolution to zoom level. (optional, default `undefined`)

@@ -81,2 +105,5 @@ Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Promise which will be resolved when the style can be used

The map returned by this function will have an additional `mapbox-style`
property which holds the Mapbox Style object.
**Parameters**

@@ -100,2 +127,26 @@

### getLayer
Get the OpenLayers layer instance that contains the provided Mapbox Style
`layer`. Note that multiple Mapbox Style layers are combined in a single
OpenLayers layer instance when they use the same Mapbox Style `source`.
**Parameters**
- `map` **ol.Map** OpenLayers Map.
- `layerId` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Mapbox Style layer id.
Returns **ol.layer.Layer** layer OpenLayers layer instance.
### getSource
Get the OpenLayers source instance for the provided Mapbox Style `source`.
**Parameters**
- `map` **ol.Map** OpenLayers Map.
- `sourceId` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Mapbox Style source id.
Returns **ol.layer.Layer** layer OpenLayers layer instance.
### stylefunction

@@ -102,0 +153,0 @@

@@ -324,2 +324,6 @@ /*

const layerId = layer.id;
// TODO revisit when diffing gets added
delete functionCache[layerId];
delete filterCache[layerId];
const layout = layer.layout || emptyObj;

@@ -326,0 +330,0 @@ const paint = layer.paint || emptyObj;

@@ -0,13 +1,87 @@

const path = require('path');
const fs = require('fs');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
/** Get the list of examples from the example directory.
*
* @param {String} dirName - Name of the directory to read.
* @param {Function} callback - Function to execute for each example.
*
* @returns {undefined} Nothing.
*/
function getExamples(dirName, callback) {
const example_files = fs.readdirSync(dirName);
const entries = {};
// iterate through the list of files in the directory.
for (const filename of example_files) {
// ooo, javascript file!
if (filename.endsWith('.js')) {
// trim the entry name down to the file without the extension.
const entry_name = filename.split('.')[0];
callback(entry_name, path.join(dirName, filename));
}
}
return entries;
}
/** Creates an object with the entry names and file names
* to be transformed.
*
* @param {String} dirName - Name of the directory to read.
*
* @returns {Object} with webpack entry points.
*/
function getEntries(dirName) {
const entries = {};
getExamples(dirName, (entryName, filename) => {
entries[entryName] = filename;
});
return entries;
}
/** Each example needs a dedicated HTML file.
* This will create a "plugin" that outputs HTML from a template.
*
* @param {String} dirName - Name of the directory to read.
*
* @returns {Array} specifying webpack plugins.
*/
function getHtmlTemplates(dirName) {
const html_conf = [];
// create the array of HTML plugins.
const template = path.join(dirName, '_template.html');
getExamples(dirName, (entryName, filename) => {
html_conf.push(
new HtmlWebpackPlugin({
title: entryName,
// ensure each output has a unique filename
filename: entryName + '.html',
template,
// without specifying chunks, all chunks are
// included with the file.
chunks: [entryName]
})
);
});
return html_conf;
}
module.exports = {
entry: './index.js',
entry: getEntries(path.resolve(__dirname, './example')),
output: {
filename: '[name].js'
},
resolve: {
alias: {
'ol-mapbox-style': path.resolve(__dirname, '.')
}
},
devtool: 'source-map',
node: {fs: 'empty'},
mode: 'development',
output: {
path: path.resolve('./dist'), // Path of output file
filename: 'olms.js',
library: 'olms'
},
module: {

@@ -21,5 +95,23 @@ rules: [

}
},
{
test: /\.css$/,
use: ['style-loader', 'css-loader']
}
]
}
},
plugins: [
// ensure the data is copied over.
// currently the index.html is manually created.
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, './example/data'),
to: 'data'
},
{
from: path.resolve(__dirname, './example/index.html'),
to: 'index.html'
}
])
].concat(getHtmlTemplates('./example'))
};

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc