Skip to content

Commit

Permalink
Release version 0.0.6.
Browse files Browse the repository at this point in the history
  • Loading branch information
@francois2metz
francois2metz committed Nov 28, 2021
1 parent 83a9e53 commit 7986a25
Show file tree
Hide file tree
Showing 4 changed files with 234 additions and 107 deletions.
172 changes: 119 additions & 53 deletions dist/openlayers-indoorequal.cjs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,33 +2,43 @@

Object.defineProperty(exports, '__esModule', { value: true });

var Feature = require('ol/Feature');
var HeatmapLayer = require('ol/layer/Heatmap');
var MVT = require('ol/format/MVT');
var TileGrid = require('ol/tilegrid/TileGrid');
var TileJSON = require('ol/source/TileJSON');
var VectorSource = require('ol/source/Vector');
var VectorTileLayer = require('ol/layer/VectorTile');
var VectorTileSource = require('ol/source/VectorTile');
var TileJSON = require('ol/source/TileJSON');
var MVT = require('ol/format/MVT');
var proj = require('ol/proj');
var TileGrid = require('ol/tilegrid/TileGrid');
var loadingstrategy = require('ol/loadingstrategy');
var control = require('ol/control');
var style = require('ol/style');
var BaseObject = require('ol/Object');
var debounce = require('debounce');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var VectorTileLayer__default = /*#__PURE__*/_interopDefaultLegacy(VectorTileLayer);
var VectorTileSource__default = /*#__PURE__*/_interopDefaultLegacy(VectorTileSource);
var TileJSON__default = /*#__PURE__*/_interopDefaultLegacy(TileJSON);
var Feature__default = /*#__PURE__*/_interopDefaultLegacy(Feature);
var HeatmapLayer__default = /*#__PURE__*/_interopDefaultLegacy(HeatmapLayer);
var MVT__default = /*#__PURE__*/_interopDefaultLegacy(MVT);
var TileGrid__default = /*#__PURE__*/_interopDefaultLegacy(TileGrid);
var TileJSON__default = /*#__PURE__*/_interopDefaultLegacy(TileJSON);
var VectorSource__default = /*#__PURE__*/_interopDefaultLegacy(VectorSource);
var VectorTileLayer__default = /*#__PURE__*/_interopDefaultLegacy(VectorTileLayer);
var VectorTileSource__default = /*#__PURE__*/_interopDefaultLegacy(VectorTileSource);
var BaseObject__default = /*#__PURE__*/_interopDefaultLegacy(BaseObject);
var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);

const MIN_ZOOM_INDOOR = 17;
const MAX_ZOOM_HEATMAP = MIN_ZOOM_INDOOR;

function extentFromTileJSON(tileJSON) {
var bounds = tileJSON.bounds;
const bounds = tileJSON.bounds;

if (bounds) {
var ll = proj.fromLonLat([bounds[0], bounds[1]]);
var tr = proj.fromLonLat([bounds[2], bounds[3]]);
const ll = proj.fromLonLat([bounds[0], bounds[1]]);
const tr = proj.fromLonLat([bounds[2], bounds[3]]);
return [ll[0], ll[1], tr[0], tr[1]];
}
}
Expand All @@ -43,16 +53,18 @@ const defaultResolutions = function () {
return resolutions;
}();

function onTileJSONLoaded(layer, tilejson) {
function createSourceFromTileJSON(tilejson) {
const tileJSONDoc = tilejson.getTileJSON();
const tiles = Array.isArray(tileJSONDoc.tiles) ? tileJSONDoc.tiles : [tileJSONDoc.tiles];
const tileGrid = tilejson.getTileGrid();
const extent = extentFromTileJSON(tileJSONDoc);
const minZoom = tileJSONDoc.minzoom;
const maxZoom = tileJSONDoc.maxzoom;
const source = new VectorTileSource__default["default"]({
return new VectorTileSource__default["default"]({
attributions: tilejson.getAttributions(),
format: new MVT__default["default"](),
format: new MVT__default["default"]({
featureClass: Feature__default["default"]
}),
tileGrid: new TileGrid__default["default"]({
origin: tileGrid.getOrigin(0),
extent: extent || tileGrid.getExtent(),
Expand All @@ -62,32 +74,62 @@ function onTileJSONLoaded(layer, tilejson) {
}),
urls: tiles
});
layer.setSource(source);
layer.setVisible(true);
}

function getLayer(url, options) {
const layer = new VectorTileLayer__default["default"]({
declutter: true,
visible: false,
...options
});
const tilejson = new TileJSON__default["default"]({
url
});
tilejson.on('change', function () {
const state = tilejson.getState();
function loadTileJSON(url) {
return new Promise((resolve, reject) => {
const tilejson = new TileJSON__default["default"]({
url
});
tilejson.on('change', function () {
const state = tilejson.getState();

if (state === 'ready') {
resolve(tilejson);
}
});

if (state === 'ready') {
onTileJSONLoaded(layer, tilejson);
if (tilejson.getState() === 'ready') {
tilejson.changed();
}
});
}

async function loadSourceFromTileJSON(url) {
const tilejson = await loadTileJSON(url);
return createSourceFromTileJSON(tilejson);
}
function getLayer(options) {
return new VectorTileLayer__default["default"]({
declutter: true,
...options
});
}
function createHeatmapSource(source) {
const tilegrid = source.getTileGrid();
const vectorSource = new VectorSource__default["default"]({
loader(extent, resolution, projection, success, failure) {
const refresh = () => {
const features = source.getFeaturesInExtent(extent);
vectorSource.clear(true);
vectorSource.addFeatures(features);
success(features);
};

if (tilejson.getState() === 'ready') {
tilejson.changed();
}
source.on('tileloadend', refresh);
refresh();
},

return layer;
loadingstrategy: loadingstrategy.tile(tilegrid)
});
return vectorSource;
}
function getHeatmapLayer(options) {
return new HeatmapLayer__default["default"]({
maxZoom: MAX_ZOOM_HEATMAP,
gradient: ['rgba(102, 103, 173, 0)', 'rgba(102, 103, 173, 0.2)', 'rgba(102, 103, 173, 0.7)'],
...options
});
}

/**
Expand Down Expand Up @@ -153,18 +195,18 @@ function areaLayer(feature, resolution) {

let stroke;

if (properties.layer === 'area' && ['area', 'corridor', 'plaform'].includes(properties.class)) {
if (['area', 'corridor', 'plaform'].includes(properties.class)) {
stroke = new style.Stroke({
color: '#bfbfbf',
width: 1
});
}

if (properties.layer === 'area' && properties.class === 'column') {
if (properties.class === 'column') {
color = '#bfbfbf';
}

if (properties.layer === 'area' && ['room', 'wall'].includes(properties.class)) {
if (['room', 'wall'].includes(properties.class)) {
stroke = new style.Stroke({
color: 'gray',
width: 2
Expand Down Expand Up @@ -299,7 +341,7 @@ function defaultStyle(map, layer, spriteBaseUrl) {
return areanameLayer(feature);
}

if (properties.layer === 'poi' && feature.getType() === 'Point') {
if (properties.layer === 'poi') {
return poiLayer(feature, resolution, map, sprite);
}
};
Expand Down Expand Up @@ -334,6 +376,7 @@ function findAllLevels(features) {
* @param {string} [options.spriteBaseUrl] The base url of the sprite (without .json or .png). If not set, no sprite will be used in the default style.
* @param {string} [options.url] Override the default tiles URL (https://tiles.indoorequal.org/).
* @param {string} [options.apiKey] The API key if you use the default tile URL (get your free key at [indoorequal.com](https://indoorequal.com)).
* @param {boolean} [options.heatmap] Should the heatmap layer be visible at start (true : visible, false : hidden). Defaults to true/visible.
* @fires change:levels
* @fires change:level
* @return {IndoorEqual} `this`
Expand All @@ -344,7 +387,8 @@ class IndoorEqual extends BaseObject__default["default"] {
const defaultOpts = {
url: 'https://tiles.indoorequal.org/',
defaultStyle: true,
spriteBaseUrl: null
spriteBaseUrl: null,
heatmap: true
};
const opts = { ...defaultOpts,
...options
Expand All @@ -362,9 +406,11 @@ class IndoorEqual extends BaseObject__default["default"] {
this.url = opts.url;
this.apiKey = opts.apiKey;

this._addLayer();
this._createLayers(opts.heatmap);

this.styleFunction = opts.defaultStyle ? defaultStyle(this.map, this.layer, opts.spriteBaseUrl) : null;
this._loadSource();

this.styleFunction = opts.defaultStyle ? defaultStyle(this.map, this.indoorLayer, opts.spriteBaseUrl) : null;

this._changeLayerOnLevelChange();

Expand All @@ -381,36 +427,54 @@ class IndoorEqual extends BaseObject__default["default"] {
setStyle(styleFunction) {
this.styleFunction = styleFunction;
}
/**
* Change the heatmap layer visibility
* @param {boolean} visible True to make it visible, false to hide it
*/


setHeatmapVisible(visible) {
this.heatmapLayer.setVisible(visible);
}

_addLayer() {
async _loadSource() {
const urlParams = this.apiKey ? `?key=${this.apiKey}` : '';
this.layer = getLayer(`${this.url}${urlParams}`);
this.map.addLayer(this.layer);
this.source = await loadSourceFromTileJSON(`${this.url}${urlParams}`);
this.indoorLayer.setSource(this.source);
this.heatmapLayer.setSource(createHeatmapSource(this.source));

this._listenForLevels();
}

_listenForLevels() {
this.layer.on('change:source', () => {
const source = this.layer.getSource();
const refreshLevels = debounce__default["default"](() => {
const extent = this.map.getView().calculateExtent(this.map.getSize());
const features = source.getFeaturesInExtent(extent);
this.set('levels', findAllLevels(features));
}, 1000);
source.on('tileloadend', refreshLevels);
this.map.getView().on('change:center', refreshLevels);
_createLayers(heatmapVisible) {
this.indoorLayer = getLayer();
this.heatmapLayer = getHeatmapLayer({
visible: heatmapVisible
});
[this.indoorLayer, this.heatmapLayer].forEach(layer => {
this.map.addLayer(layer);
});
}

_listenForLevels() {
const source = this.source;
const refreshLevels = debounce__default["default"](() => {
const extent = this.map.getView().calculateExtent(this.map.getSize());
const features = source.getFeaturesInExtent(extent);
this.set('levels', findAllLevels(features));
}, 1000);
source.on('tileloadend', refreshLevels);
this.map.getView().on('change:center', refreshLevels);
}

_changeLayerOnLevelChange() {
this.on('change:level', () => {
this.layer.changed();
this.indoorLayer.changed();
});
}

_setLayerStyle() {
this.layer.setStyle((feature, resolution) => {
this.indoorLayer.setStyle((feature, resolution) => {
if (feature.getProperties().level === this.get('level')) {
return this.styleFunction && this.styleFunction(feature, resolution);
}
Expand Down Expand Up @@ -443,4 +507,6 @@ class IndoorEqual extends BaseObject__default["default"] {
exports.LevelControl = LevelControl;
exports["default"] = IndoorEqual;
exports.defaultStyle = defaultStyle;
exports.getHeatmapLayer = getHeatmapLayer;
exports.getLayer = getLayer;
exports.loadSourceFromTileJSON = loadSourceFromTileJSON;
Loading

0 comments on commit 7986a25

Please sign in to comment.