openlayers / ol-mapbox-style Goto Github PK
View Code? Open in Web Editor NEWUse Mapbox Style objects with OpenLayers
Home Page: https://unpkg.com/ol-mapbox-style/dist/examples/index.html
License: BSD 2-Clause "Simplified" License
Use Mapbox Style objects with OpenLayers
Home Page: https://unpkg.com/ol-mapbox-style/dist/examples/index.html
License: BSD 2-Clause "Simplified" License
It would be nice to be able to generate a regular OL Style descriptor as a string. Could then just be copied into the code and wouldn´t make it necessary to deliver your lib in production (at least for static styles).
Do you think that would make sense?
Hello!
I work on at Mapbox on Mapbox GL. We are preparing to make some changes to the mapbox-gl-style-spec
package which may affect you:
mapbox-gl-style-spec
package will be deprecated and replaced by @mapbox/mapbox-gl-style-spec
mapbox-gl-style-spec
package will begin using es6 features, requiring the use of transpilation (if you're using browserify, this'll happen automatically via bubleify)mapbox-gl-style-spec
will change (which will affect the use of require(mapbox-gl-style-spec/lib/**/*.js)
)You can read more about these changes at mapbox/mapbox-gl-js#3946 and mapbox/mapbox-gl-js#3656.
Let me know if you have any questions or need any help!
The version number in package.json
(currently 2.10.4) doesn't match the released version on npm (currently 2.11.2)
@ahocevar Would it make sense to have a patched Mapbox GL spec that only contains the properties and layer types that are supported by ol-mapbox-style
?
I would take care of it. It could be in this repo or in another one.
For https://github.com/maputnik/editor this would allow me to only display properties for a OL3 style that can be supported.
And in general it would help to specify and document the subset of the Mapbox GL spec that is supported by ol-mapbox-style
.
As always - I love this plugin.
node-gyp rebuild
./util/has_lib.sh: line 31: pkg-config: command not found
gyp: Call to './util/has_lib.sh freetype' returned exit status 0 while in binding.gyp. while trying to load binding.gyp
gyp ERR! configure error
gyp ERR! stack Error: gyp
failed with exit code: 1
gyp ERR! stack at ChildProcess.onCpExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:345:16)
gyp ERR! stack at ChildProcess.emit (events.js:182:13)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:238:12)
gyp ERR! System Darwin 16.7.0
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /Users/didi/wanglei/codes/styles/ol-mapbox-style/node_modules/canvas
gyp ERR! node -v v10.8.0
gyp ERR! node-gyp -v v3.7.0
gyp ERR! not ok
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: node-gyp rebuild
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/didi/.npm/_logs/2018-08-20T04_01_11_568Z-debug.log
Hi was looking forward to trying react-openlayers out but it won't npm install because it depends on ol-mapbox-style - and ol-mapbox-style won't install because your dependency mapbox-gl-style-spec is gone(?)
i.e. It appears the mapbox-gl-style-spec repo is now just a placeholder see:
https://github.com/mapbox/mapbox-gl-style-spec
It says: "This repository has been merged with mapbox-gl-js"
Here's my full install ouput JIC it helps:
npm install react-openlayers --save-dev
npm ERR! Darwin 15.6.0
npm ERR! argv "/Users/dcrus/.nvm/versions/node/v6.10.0/bin/node" "/Users/dcrus/.nvm/versions/node/v6.10.0/bin/npm" "install" "react-openlayers" "--save-dev"
npm ERR! node v6.10.0
npm ERR! npm v3.10.10
npm ERR! code E404
npm ERR! 404 Not found : @mapbox/mapbox-gl-style-spec
npm ERR! 404
npm ERR! 404 '' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404 It was specified as a dependency of 'ol-mapbox-style'
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.
npm ERR! Please include the following file with any support request:
npm ERR! /Users/dcrus/field-maps-nav/npm-debug.log
I import latest ol and ol-mapbox-style pakcage, and I only write one line code 'apply('map', this.serverHost + 'event_didi.json');', but error occured when compiling.
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/util/color.js
Module parse failed: Unexpected token (17:5)
You may need an appropriate loader to handle this file type.
| */
| class Color {
| r: number;
| g: number;
| b: number;
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/expression/index.js
Module parse failed: Unexpected token (19:12)
You may need an appropriate loader to handle this file type.
| import { success, error } from '../util/result';
|
| import type {Type} from './types';
| import type {Value} from './values';
| import type {Expression} from './expression';
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/feature_filter/index.js
Module parse failed: Unexpected token (5:12)
You may need an appropriate loader to handle this file type.
| import { createExpression } from '../expression';
|
| import type {GlobalProperties} from '../expression';
| export type FeatureFilter = (globalProperties: GlobalProperties, feature: VectorTileFeature) => boolean;
|
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/util/interpolate.js
Module parse failed: Unexpected token (5:24)
You may need an appropriate loader to handle this file type.
| import Color from './color';
|
| export function number(a: number, b: number, t: number) {
| return (a * (1 - t)) + (b * t);
| }
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/function/convert.js
Module parse failed: Unexpected token (7:12)
You may need an appropriate loader to handle this file type.
| import extend from '../util/extend';
|
| import type {StylePropertySpecification} from '../style-spec';
|
| export default convertFunction;
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/util/color_spaces.js
Module parse failed: Unexpected token (7:5)
You may need an appropriate loader to handle this file type.
| import {number as interpolateNumber} from './interpolate';
|
| type LABColor = {
| l: number,
| a: number,
ERROR in ./node_modules/@mapbox/mapbox-gl-style-spec/expression/definitions/interpolate.js
Module parse failed: Unexpected token (9:12)
You may need an appropriate loader to handle this file type.
| import { findStopLessThanOrEqualTo } from '../stops';
|
| import type { Stops } from '../stops';
| import type { Expression } from '../expression';
| import type ParsingContext from '../parsing_context';
First, thanks for this module.
Do you have any working example page using plunker, jsfiddle, or any?
I am an author of react-openlayers, and tried to implement with ol.layer.VectorTile with MapBox style json object.
Currently, I am trying to achieve this with the current version of olms, but not successful yet.
Ref. allenhwkim/react-openlayers#2
https://rawgit.com/allenhwkim/react-openlayers/master/app/index.html#/layers/vector-tile-2
Hi @ahocevar , this script is a very great work, but I'm not sure if I was missed some configuration for this problem.
Hı ,
I am using olms to load arcgis style in my ol vector tile. I have two basic problems.
Help me with your suggestions :)
Hello,
So it looks like the apply()
function doesn't return a promise, only the applyStyle()
does. Is there a particular reason for this? Is it somehow infeasible? I'd like to know if there's a reason it can't be done before heading down the rabbit hole...
thanks,
fleur
I'm just trying out this library, and it looks great, but there's an obvious issue with labels showing up at the wrong zooms.
Mapbox-gl-js (zoom 13):
ol-mapbox-style (zoom 14):
One of the layers that shouldn't be displaying (containing the churches, primary schools etc) is defined thus:
{
"id": "foi-label",
"type": "symbol",
"source": "VMFEAT",
"source-layer": "foi_index_centroid",
"filter": [
"!in",
"FTYPE",
"sign",
"care facility",
"residential building",
"community venue",
"communication service"
],
"layout": {
"text-field": "{NAME_LABEL}",
"text-size": 10,
"text-max-width": 6
},
"paint": {
"text-color": {
"property": "FTYPE",
"type": "categorical",
"default": "green",
"stops": [
[
"reserve",
"green"
],
[
"education centre",
"hsl(30, 50%, 50%)"
],
[
"place of worship",
"hsl(30, 50%, 50%)"
],
[
"dumping ground",
"hsl(0, 0%, 50%)"
],
[
"hospital",
"hsl(0, 50%, 50%)"
]
]
},
"text-opacity": {
"stops": [
[
14.5,
0
],
[
15,
1
]
]
},
"text-halo-width": 1,
"text-halo-color": "hsla(0, 0%, 100%, 70%)"
}
},
AFAIK, using text-opacity
like this is the recommended way to have a layer only show up above a certain zoom level in mapbox-gl-js. Is there a workaround in ol-mapbox-style, perhaps minzoom
?
Hi ,I am using olms to load arcgis style in my ol vector tile. there i have set max zoom to 15. but some of the .pbf request at certain areas fails at zoom level 14 and map gets blurred. i am not sure this is the right place to post. Help me with your suggestions :)
I have a problem to build the lib.
When I do a npm install, the process is stopped to the canvas install.
C:\Users\xxx.node-gyp\6.10.0\include\node\v8.h(19): fatal error C1083: Impossible d'ouvrir le fichier include : 'stdint.h' : No such file or directory [C:\Users\xxx\Downloads\ol-mapbox-style3.3.0\node_modules\canvas\build\binding.sln]
Could you help me please ?
thx
Hi
I'm trying to get a map to display with multiple styles of map ( street / satellite )
I can get the map to load with a single style... and i have also added some button which then ADD the other style. However i want the previous style to be removed.
`var satJson = 'https://maps.tilehosting.com/styles/hybrid/style.json?key=[MYKEYGOESHERE]' ;
var styleJson = 'content/mapping/openmaptiles-street/style-basic-original.json';
var map_view = new ol.View({
center: ol.proj.fromLonLat([-1.0, 53]),
zoom: 16
})
var map = new ol.Map({
target: 'map',
view: map_view
});
olms.apply(map, satJson);`
how would i go about toggle between the 2 styles?
Thanks
When I build the olms.js file using npm install
the resulting dist/olms.js
file doesn't work in the browser. There's lots of network errors as it tries to download /openlayers/map.js
and a load of other missing files.
The https://www.mapbox.com/mapbox-gl-style-spec/#layers-background layer type is not supported by ol-mapbox-style
. Is that correct?
The background stays transparent (so here instead of white, I see the black color of my HTML page).
Hi, I have some vector tiles are not well displayd, I found that the reason of it is the resolutions. My vectorTiles ues different resolutions.
.
I saw the code and found that
"applyStyleFunction"
function supports "resolutions"
parameter, but "onchange"
function passed "undefined"
to it.
If possible i want to add a "resolutions"
parameter to "applyStyle"
function , and pass it to "applyStyleFunction"
This is a quite interesting bug.
As long as I've used ol-debug.js
it worked just fine. However, using a custom build ol.js
, it stopped working (does not even render the layer with the basic OL styles), throwing mysterious errors to the console.
I managed to get it up and running again with this patch, but I'd like to hear what you think.
Version
3.0.0-beta.7 - work fine
but "ol-mapbox-style": "^3.0.0-beta.9" - generate errors
webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
ERROR Failed to compile with 7 errors13:15:45
error in ./node_modules/@mapbox/mapbox-gl-style-spec/util/color.js
Module parse failed
: Unexpected token (17:5)
You may need an appropriate loader to handle this file type.
| */
| class Color {
| r: number;
| g: number;
| b: number;
@ ./node_modules/ol-mapbox-style/index.js 23:0-60
@ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/components/pages/OlMap/OlMap.vue
@ ./src/components/pages/OlMap/OlMap.vue
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?https://localhost:8080 webpack/hot/dev-server ./src/main.js
and etc. see atachment
rr.txt
Hi,Do you have plans to support 'fill-pattern' parameter?
Like http://openlayers.org/en/latest/examples/canvas-gradient-pattern.html?q=Pattern
It is helpful for land-related maps.
When rendering a mapbox style with a spritesheet on a high-resolution display, if there is no high resolution version on the spritesheet, ol-mapbox-style should fall back to using the regular spritesheet.
Current behavior is to try and read the response as a spritesheet anyways, even if a 404 is returned:
[email protected]:1 GET http://localhost:8080/geoserver/styles/[email protected] 404 ()
olms.js:193 GET http://localhost:8080/geoserver/styles/[email protected] 404 ()
VM4263:1 Uncaught SyntaxError: Unexpected token < in JSON at position 0
at JSON.parse (<anonymous>)
at XMLHttpRequest.xhr.onload.xhr.onerror (olms.js:190)
In package.json
, the pretest
is:
eslint src & npm run test-bundle
But there's not src
directory. Shouldn't it be changed to something like:
eslint index.js & npm run test-bundle
For users that just want to display a Mapbox GL style JSON with ol-mapbox-style
there could be a more convenient higher level API.
Perhaps something like this. Ideally just passing the style URL.
var olms = require('ol-mapbox-style');
olms.addStyleLayer('https://raw.githubusercontent.com/openmaptiles/osm-bright-gl-style/master/style.json');
Would this be something that would fit into this repo? Otherwise I would put it into another repo which includes ol-mapbox-style
.
In Maputnik right now I generate the vector sources dynamically (it is quite a hack though) for ol-mapbox-style
but I would also like that users have this functionality when they use the style with OL3.
This would be an additional higher level API that takes care of:
I have a Mapbox style that is a composite of multiple sources: Mapbox Streets V7 + Vector Terrain V2(Composite source). How can I load multiple sources into the ol.source.VectorTile?
I am trying something like this:
var tilegrid = ol.tilegrid.createXYZ({tileSize: 512, maxZoom: 22});
var layer = new ol.layer.VectorTile({
source: new ol.source.VectorTile({
format: new ol.format.MVT(),
tileGrid: tilegrid,
tilePixelRatio: 8,
urls: [
'http://{a-d}.tiles.mapbox.com/v4/mapbox.mapbox-streets-v7/{z}/{x}/{y}.vector.pbf?access_token=' + mapboxKey,
'http://{a-d}.tiles.mapbox.com/v4/mapbox.mapbox-terrain-v2/{z}/{x}/{y}.vector.pbf?access_token=' + mapboxKey
]
})
});
If fill-opacity
is zoom-based (uses stop
s), black polygons appear instead of parks, nature reserves, buildings, towns etc. with their correct color codes.
"fill-opacity": {
"stops": [
[
6,
0.7
],
[
9,
0.9
]
]
}
My current workaround is using a constant, then the issue does not appear:
"fill-opacity": 1,
The style I am trying to use is available at: https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json (there are several places where fill-opacity needs to be changed)
Sample javascript to reproduce the issue:
var baseUrl = 'https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json';
// var baseUrl = 'voyager.json';
var map = olms.apply('map', baseUrl);
Most likely culprit is alpha interpolation, but so far I have been unable to find the exact issue.
I got an Uncaught TypeError: geometry.getFlatInteriorPoint is not a function
unless I define format: new ol.format.MVT({featureClass: ol.Feature})
on ol.source.VectorTile
, which suggests that getFlatInteriorPoint
is not defined for ol.render.Feature
features.
Interestingly your example works just fine without featureClass: ol.Feature
.
I'll investigate this issue further, just wanted to mention this at the first place - maybe you have a suggestion from the top of your head.
Hello,
I think it would be interesting to add in the documentation a note about browser compatibility.
Can you confirm that using this module it is possible to render full mapbox styles without depending on webgl and therefore support much older browsers than mapbox-gl-js ?
If so I think it is the great strength of this module as it provides an alternative to webgl and server side rendering.
Using an old version of the library I get to work mapbox styles but in a slowly way. Now, I am using the last version of this library but I don't see how I do to make it work.
I am doing something like this:
Layer definition
const vtLayer = new ol.layer.VectorTileLayer({
declutter: true,
renderMode: 'image',
renderBuffer: 2,
source: new ol.source.VectorTileSource({
format: new ol.format.MVT(),
overlaps: false,
url: 'http://10.0.2.93:8080/geoserver/gwc/service/tms/1.0.0/bl:B_PARC@EPSG:900913@pbf/{z}/{x}/{-y}.pbf?1537872297191'
})
});
VT Style definition
var stylelyrs= {
"version": 8,
"name": "test",
"sources": {
"test": {
"type": "vector"
}
},
"layers": [{
"id": "bl:B_PARC",
"type": "fill",
"source": "bl:B_PARC",
"paint": {
"fill-color": "#00cc00",
"fill-opacity": 0.6,
"line-color": "#004d00",
"line-width": 1
}
}]
};
Assigning style function
olms.stylefunction(vtLayer, stylelyrs, 'bl:B_PARC');
pbf's are loading behind but I can't see any geometry on my map, I guess it must be something related with olms applyiing style (as I said, with old version is working - getStyleFunction method). Do you know why is not working with the newest? Do you have more examples or documentation?
Thank you.
Is it possible to use this library as AMD module? Now I get erros about not found files from this section of code:
if (typeof define === 'function' && define.amd) {
define([
"_",
"ol/observable",
"ol/proj",
"ol/tilegrid",
"ol/map",
"ol/format/geojson",
"ol/format/mvt",
"ol/layer/tile",
"ol/layer/vector",
"ol/layer/vectortile",
"ol/source/tilejson",
"ol/source/vector",
"ol/source/xyz",
"ol/source/vectortile",
"ol/style/style",
"ol/style/fill",
"ol/style/stroke",
"ol/style/circle"
], f.bind(_g, r))
}
Does it make sense to add support of passing ol
object to ol-mapbox-style
?
AFAICT from testing with mapbox GL JS it seems that the assumption we make in ol-mapbox-style
is incorrect, i.e. the type background layer can be anywhere in the stack, not just at the bottom
Hello,
I am using Tileserver GL and/or Tileserver GL light to serve vector tiles.
I ran into two an issues with ol-mapbox-style :
var spriteRegEx = /^(.*)(\?.*)$/;
url = glSource.url;
line 252) is in fact a TileJSON URL http://127.0.0.1/data/planet.json
with Tileserver. The vector URL can be accessed using TileJSON URL {"tiles":["http://127.0.0.1/data/planet/{z}/{x}/{y}.pbf"], ...}
Are those Is this issues only related to Tileserver GL? Is it possible to make a patch for the first issue (I was able to work around the second issue using applyBackground and applyStyle)?
For instance if I modify wms.json
to:
"id": "states-wms",
"source": "states",
"layout": {
"visibility": "none"
}
it is not taken into account. Same applies to osm in that same file.
With the update to the polygon fill hit detection in openlayers/openlayers#7750, I cannot set a fill-color
to have a 0 opacity or fill-opacity: 0
within a stylesheet and have any kind of hit detection within a polygon. When the styles are converted into a style function through this package, it treats a 0 opacity polygon fill instead as having no fill and so no hit is detected.
Hiya,
Just came across this issue where the stylefunction.js
' fromTemplate
function receives an array
as it's text
argument, therefore it throws a wobbly.
Uncaught TypeError: text.match is not a function
Within Mapbox Studio one might use a function (to-string()
) to convert non-string fields to string fields and use those as labels, hence the issue.
The text argument looks something like this:
["to-string", ["get", "<attributeName>"]]
A quick and dirty workaround can look like this:
if (Array.isArray(text) && text.length === 2 && text[0] === 'to-string' && Array.isArray(text[1]) && text[1].length === 2 && text[1][0] === 'get') {
text = properties[text[1][1]].toString();
}
I know it this is still not production ready but could you publish ol-mapbox-gl-style
to npm?
BTW. I am really amazed by this project. Hope to contribute. This could be the corner stone of building an style editor for OL3. maplibre/maputnik#7
I am trying to style a point features in an ol.layer.Vector
with a simple icon-image
defined in a Mapbox GL Style. Therefore I am executing the API function getStyleFunction
, which raises an exception:
In line 408 of the index script the function fromTemplate
is executed which leads to the mentioned exception. The regex used in this function does not match with the expression in the style property icon-image
and returns null
(see here ). Which kind of expression is expected here? Has the regex to be adapted or is the style description (see code below) incorrect although it is exported from Mapbox studio?
The style object used looks like this:
{
"id": "foo",
"type": "symbol",
"source": "composite",
"source-layer": "foolayer",
"interactive": true,
"filter": [
"all",
[
"==",
"$type",
"Point"
],
[
"all",
[
"==",
"propertyFoo",
2
]
]
],
"layout": {
"icon-image": "dam-15",
"visibility": "visible"
}
}
currently apply only takes a string to a url. In my case I want to parse the JSON doc myself so I can update the redux store's state with the doc's info, and then pass on the parsed doc to ol-mapbox-style.
Hello,
I have a OL5 map using a projection of EPSG:4326. I am adding a Vector Tile layer with a projection of ESPG:4326.
When I am using OLMS to apply a style to my Vector Tile I am seeing weird issues with how the styling is being rendered. I am assuming there is a disconnect with the Vector Tile Styling data vs the projection my map supports.
Any idea on why the below code does not seem to style the Vector Tile correctly? Is this a issue with the plugin or a issue with the way the layer is configured.
// Create vector tile layer
var layer = new ol.layer.VectorTile({
source: new ol.source.VectorTile({
format: new ol.format.MVT({ featureClass: ol.render.Feature }),
url: 'https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/tile/{z}/{y}/{x}.pbf',
projection: ol.proj.get("EPSG:4326")
})
});
// Create map
var map = new ol.Map({
target: 'map',
view: new ol.View({
projection: 'EPSG:4326',
center: [0, 0],
zoom: 2
}),
layers: [layer]
});
// Get style
$.get("https://www.arcgis.com/sharing/rest/content/items/291da5eab3a0412593b66d384379f89f/resources/styles/root.json")
.then(function(res) {
olms.applyStyle(layer, res, "esri");
});
Hi, I'm trying to implement a mapbox style I've made using the apply functionality. However since this errors shows up during the building during webpack, the website won't work.
Removing import {apply} from 'ol-mapbox-style';
solves the loading, so it's an issue within the package itself.
Hi ,I am using olms to load arcgis style in my ol vector tile.
I use many fonts . some fonts can not be displayed correctly
how can i solve this problem ?
Thank You :)
I'm not familar with NodeJS so I'll put my proposals here ;-)
Now the code für multi language is usable. But If you have e.g. german, english or similar things with line breaks as "\n", than your OL code will not wrap. Instead it will put a white space for it and the multi line formatting is gone.
Here are my changes to have it like it should.
wrapText (around line 1850 in /dist)
var textSplit = /\s+/g;
var words = text.split(textSplit);
fromTemplate (around line 2550 in /dist)
var templateRegEx = /(\s*\S*)\{(.*)\}/g;
String.prototype.matchAll = function(regexp) {
var matches = [];
this.replace(regexp, function() {
var arr = ([]).slice.call(arguments, 0);
var extras = arr.splice(-2);
arr.index = extras[0];
arr.input = extras[1];
matches.push(arr);
});
return matches.length ? matches : null;
}
function fromTemplate(text, properties) {
var parts = text.matchAll(templateRegEx);
if (parts) {
var returnStr = "";
for (var i in parts) {
var part = parts[i];
returnStr += part[1] + (properties[part[2]] || '');
}
return returnStr.trim();
} else {
return text;
}
}
Hi, i used Maputnik to create a new style object: http://192.168.1.55:8080/styles/klokantech-basic.json
I'm using webpack to bundle the source (ol 4.1.0) and try to build a map inside a react app like so:
this.map = new Map({target: this.map_wrapper});
apply(this.map, 'http://192.168.1.55:8080/styles/klokantech-basic.json');
I'm a bit none-plussed about what is causing this error - any help is much appreciated!
When writing unit tests, intercepting will be easier if we use fetch instead of XMLHttpRequest
I have a problem related with a label layer which has a field itself that indicates the angle of rotation. I am trying to make it work but I can't.
The example below has the style to represent the rotated labels:
http://jsfiddle.net/8kyp19qz/8/
If I delete the "text-rotate" : "{AA_TXANG}" property labels are displayed with no rotation.
Could someone help me on how I should have to describe the Style configuration?
Hi,
Using this package in a react app, when i try to build for prod, i've got the following error :
`
npm run build
[email protected] build /app/front
react-scripts buildCreating an optimized production build...
Failed to compile.Failed to minify the code from this file:
./node_modules/@mapbox/mapbox-gl-style-spec/function/index.js:15
`
(npm run build launch react-scripts build)
I'm trying to solve that problem. If you have any clue on what's happening. I'm not a master on npm builds.
Thanks.
FYI. This is on the master tree. It references the URL https://osm.tegola.io/capabilities/osm.json and fails due to CORS headers. It appears the URL is no longer available:
$ wget https://osm.tegola.io/capabilities/osm.json
--2018-10-16 14:11:12-- https://osm.tegola.io/capabilities/osm.json
Resolving osm.tegola.io (osm.tegola.io)... 52.85.201.42, 52.85.201.10, 52.85.201.59, ...
Connecting to osm.tegola.io (osm.tegola.io)|52.85.201.42|:443... connected.
HTTP request sent, awaiting response... 503 Service Unavailable
2018-10-16 14:11:12 ERROR 503: Service Unavailable.
Hi, do you experienced any incompatibility with Angular 5 and the latest Openlayers version?
I'm getting a
ERROR TypeError: targetElement.appendChild is not a function
at _ol_Map_._ol_PluggableMap_.handleTargetChanged_ (pluggablemap.js:817)
at _ol_Map_.boundListener (events.js:16)
at _ol_Map_._ol_events_EventTarget_.dispatchEvent (eventtarget.js:77)
at _ol_Map_._ol_Object_.notify (object.js:120)
at _ol_Map_._ol_Object_.set (object.js:139)
at _ol_Map_._ol_Object_.setProperties (object.js:153)
at _ol_Map_._ol_PluggableMap_ [as constructor] (pluggablemap.js:241)
at new _ol_Map_ (map.js:92)
at c.apply (index.js:452)
at AppComponent.ngOnInit
as soon as I call the apply on a simple map with one vector layer.
I'm trying to replicate the issue on stackblitz to help you understand what happens but in the meanwhile I was wondering if already know that I will not solve the issue.
Thanks.
When using IE11 (unfortunately still used in many companies) the code for vector tiles is not working. Even the example crashed with exception "symbol undefined".
Is there a possibility that someone can look at it and fix it if possible?
https://rawgit.com/boundlessgeo/ol-mapbox-style/v2.10.1/example/tilejson-vectortile.html
Addtional for older browsers:
Uncaught exception: TypeError: 'inputs[Symbol.iterator]' is not a function
Error thrown at line 1118, column 9 in <anonymous function: module.exports>(output) in http://www.example.com/modules/maps/js/olms.js:
throw _iteratorError;
called from line 771, column 8 in createFunction(parameters, propertySpec) in http://www.example.com/modules/maps/js/olms.js:
parameters = extend({}, parameters);
called from line 2018, column 8 in convertToFunctions(properties, type) in http://www.example.com/modules/maps/js/olms.js:
properties[property] = (0, _function2.default)(value, {
called from line 2072, column 6 in preprocess(layer, fonts) in http://www.example.com/modules/maps/js/olms.js:
convertToFunctions(layer.paint, 'interpolated');
called from line 1635, column 8 in <anonymous function: exports.default>(olLayer, glStyle, source, resolutions, spriteData, spriteImageUrl, fonts) in http://www.example.com/modules/maps/js/olms.js:
preprocess(layer, fonts);
called from line 237, column 9 in onChange() in http://www.example.com/modules/maps/js/olms.js:
style = (0, _mapboxToOlStyle2.default)(layer, glStyle, source, undefined, spriteData, spriteImageUrl, availableFonts);
called from line 225, column 12 in <anonymous function: xhr.onerror>() in http://www.example.com/modules/maps/js/olms.js:
onChange();
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.