diff --git a/package-lock.json b/package-lock.json index 5c0ee71b..c90af1f3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9739,19 +9739,48 @@ "dev": true }, "ol": { - "version": "5.3.2", - "resolved": "https://registry.npmjs.org/ol/-/ol-5.3.2.tgz", - "integrity": "sha512-PfS8Fe1iy4YNJ7P+TvebKME+8gp5NBfQuIldAHfBCkc7agmTezscQrsJWggz5B6Sprm/M/4YBtbyQtw4pIC65w==", + "version": "6.0.0-beta.8", + "resolved": "https://registry.npmjs.org/ol/-/ol-6.0.0-beta.8.tgz", + "integrity": "sha512-oxMAue70DIx/PrlisQvXTDFTx9WXau+LofShYC3oKDaxBEOjRLaYV4mRa6ldQ9ps/3E2ydQ+2MNwJyaMzktbCg==", "requires": { - "pbf": "3.1.0", + "pbf": "3.2.0", "pixelworks": "1.1.0", "rbush": "2.0.2" + }, + "dependencies": { + "ieee754": { + "version": "1.1.13", + "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz", + "integrity": "sha512-4vf7I2LYV/HaWerSo3XmlMkp5eZ83i+/CDluXi/IGTs/O1sejBNhTtnxzmRZfvOUqj7lZjqHkeTvpgSFDlWZTg==" + }, + "pbf": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/pbf/-/pbf-3.2.0.tgz", + "integrity": "sha512-98Eh7rsJNJF/Im6XYMLaOW3cLnNyedlOd6hu3iWMD5I7FZGgpw8yN3vQBrmLbLodu7G784Irb9Qsv2yFrxSAGw==", + "requires": { + "ieee754": "^1.1.12", + "resolve-protobuf-schema": "^2.1.0" + } + }, + "protocol-buffers-schema": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/protocol-buffers-schema/-/protocol-buffers-schema-3.3.2.tgz", + "integrity": "sha512-Xdayp8sB/mU+sUV4G7ws8xtYMGdQnxbeIfLjyO9TZZRJdztBGhlmbI5x1qcY4TG5hBkIKGnc28i7nXxaugu88w==" + }, + "resolve-protobuf-schema": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/resolve-protobuf-schema/-/resolve-protobuf-schema-2.1.0.tgz", + "integrity": "sha512-kI5ffTiZWmJaS/huM8wZfEMer1eRd7oJQhDuxeCLe3t7N7mX3z94CN0xPxBQxFYQTSNz9T0i+v6inKqSdK8xrQ==", + "requires": { + "protocol-buffers-schema": "^3.3.1" + } + } } }, "ol-mapbox-style": { - "version": "4.3.1", - "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-4.3.1.tgz", - "integrity": "sha512-b3p4lvmEAxyoid3WklQJVH0wfQgz8QU6E0c15Avbybt/3oL0LtZ76+TdHxq29GomFXWK3ywn+4PscPm4o+edRw==", + "version": "5.0.0-beta.2", + "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-5.0.0-beta.2.tgz", + "integrity": "sha512-xU960zy6VhKXSaur/5hLM0j6OgJd+EHFaMWbX3o6oU/fnJKBmxJFYg55Ry50p8+Hv5FkUd5zGK9u6n8ewahiPw==", "requires": { "@mapbox/mapbox-gl-style-spec": "^13.6.0", "mapbox-to-css-font": "^2.3.0", diff --git a/package.json b/package.json index 75d40e44..6fe3fd18 100644 --- a/package.json +++ b/package.json @@ -37,8 +37,8 @@ "mapbox-gl": "^0.53.1", "mapbox-gl-inspect": "^1.3.1", "maputnik-design": "github:maputnik/design", - "ol": "^5.3.2", - "ol-mapbox-style": "^4.3.0", + "ol": "^6.0.0-beta.8", + "ol-mapbox-style": "^5.0.0-beta.2", "prop-types": "^15.6.2", "react": "^16.5.2", "react-aria-menubutton": "^6.0.1", diff --git a/src/components/map/OpenLayersMap.jsx b/src/components/map/OpenLayersMap.jsx index 8c87d46c..9cb5ee24 100644 --- a/src/components/map/OpenLayersMap.jsx +++ b/src/components/map/OpenLayersMap.jsx @@ -1,4 +1,5 @@ import React from 'react' +import {throttle} from 'lodash'; import PropTypes from 'prop-types' import { loadJSON } from '../../libs/urlopen' @@ -22,10 +23,14 @@ export default class OpenLayersMap extends React.Component { constructor(props) { super(props); + this.updateStyle = throttle(this._updateStyle.bind(this), 200); } - updateStyle(newMapStyle) { + _updateStyle(newMapStyle) { if(!this.map) return; + + // See + this.map.getLayers().clear(); apply(this.map, newMapStyle); }