Merge pull request #10767 from mike-000/patch-8

Replace Bing layer with MapTiler in examples
This commit is contained in:
Andreas Hocevar
2020-03-08 14:24:20 +01:00
committed by GitHub
4 changed files with 24 additions and 14 deletions

View File

@@ -6,9 +6,9 @@ docs: >
This example generates a `GetFeature` request which uses a `PropertyIsEqualTo` This example generates a `GetFeature` request which uses a `PropertyIsEqualTo`
and a `PropertyIsLike` filter, and then posts the request to load the features and a `PropertyIsLike` filter, and then posts the request to load the features
that match the query. that match the query.
tags: "vector, WFS, GetFeature, filter" tags: "vector, WFS, GetFeature, filter, maptiler"
cloak: cloak:
- key: As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5 - key: get_your_own_D6rA4zTHduk6KOKTXzGB
value: Your Bing Maps Key from http://www.bingmapsportal.com/ here value: Get your own API key at https://www.maptiler.com/cloud/
--- ---
<div id="map" class="map"></div> <div id="map" class="map"></div>

View File

@@ -7,7 +7,7 @@ import {
} from '../src/ol/format/filter.js'; } from '../src/ol/format/filter.js';
import {WFS, GeoJSON} from '../src/ol/format.js'; import {WFS, GeoJSON} from '../src/ol/format.js';
import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js'; import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
import BingMaps from '../src/ol/source/BingMaps.js'; import XYZ from '../src/ol/source/XYZ.js';
import VectorSource from '../src/ol/source/Vector.js'; import VectorSource from '../src/ol/source/Vector.js';
import {Stroke, Style} from '../src/ol/style.js'; import {Stroke, Style} from '../src/ol/style.js';
@@ -23,10 +23,15 @@ const vector = new VectorLayer({
}) })
}); });
const key = 'get_your_own_D6rA4zTHduk6KOKTXzGB';
const attributions = '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> ' +
'<a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>';
const raster = new TileLayer({ const raster = new TileLayer({
source: new BingMaps({ source: new XYZ({
imagerySet: 'Aerial', attributions: attributions,
key: 'As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5' url: 'https://api.maptiler.com/tiles/satellite/{z}/{x}/{y}.jpg?key=' + key,
maxZoom: 20
}) })
}); });

View File

@@ -4,9 +4,9 @@ title: WFS
shortdesc: Example of using WFS with a BBOX strategy. shortdesc: Example of using WFS with a BBOX strategy.
docs: > docs: >
This example loads new features from GeoServer WFS when the view extent changes. This example loads new features from GeoServer WFS when the view extent changes.
tags: "vector, WFS, bbox, loading, server" tags: "vector, WFS, bbox, loading, server, maptiler"
cloak: cloak:
- key: As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5 - key: get_your_own_D6rA4zTHduk6KOKTXzGB
value: Your Bing Maps Key from http://www.bingmapsportal.com/ here value: Get your own API key at https://www.maptiler.com/cloud/
--- ---
<div id="map" class="map"></div> <div id="map" class="map"></div>

View File

@@ -3,7 +3,7 @@ import View from '../src/ol/View.js';
import GeoJSON from '../src/ol/format/GeoJSON.js'; import GeoJSON from '../src/ol/format/GeoJSON.js';
import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js'; import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
import {bbox as bboxStrategy} from '../src/ol/loadingstrategy.js'; import {bbox as bboxStrategy} from '../src/ol/loadingstrategy.js';
import BingMaps from '../src/ol/source/BingMaps.js'; import XYZ from '../src/ol/source/XYZ.js';
import VectorSource from '../src/ol/source/Vector.js'; import VectorSource from '../src/ol/source/Vector.js';
import {Stroke, Style} from '../src/ol/style.js'; import {Stroke, Style} from '../src/ol/style.js';
@@ -30,10 +30,15 @@ const vector = new VectorLayer({
}) })
}); });
const key = 'get_your_own_D6rA4zTHduk6KOKTXzGB';
const attributions = '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> ' +
'<a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>';
const raster = new TileLayer({ const raster = new TileLayer({
source: new BingMaps({ source: new XYZ({
imagerySet: 'Aerial', attributions: attributions,
key: 'As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5' url: 'https://api.maptiler.com/tiles/satellite/{z}/{x}/{y}.jpg?key=' + key,
maxZoom: 20
}) })
}); });