ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #10417 from mike-000/patch-3

Browse Source 
Replace Bing layer with MapTiler
This commit is contained in:
Tim Schaub
2019-12-16 19:43:12 -07:00
committed by GitHub
parent 23251947be 3bf1931f39
commit 2b45bc054e
2 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/image-filter.html
+3 -3
View File
@@ -6,10 +6,10 @@ docs: >
<p>Layer rendering can be manipulated in <code>prerender</code> and <code>postrender</code> event listeners. <p>Layer rendering can be manipulated in <code>prerender</code> and <code>postrender</code> event listeners.
These listeners get an event with a reference to the Canvas rendering context. These listeners get an event with a reference to the Canvas rendering context.
In this example, the <code>postrender</code> listener applies a filter to the image data.</p> In this example, the <code>postrender</code> listener applies a filter to the image data.</p>
tags: "filter, image manipulation" tags: "filter, image manipulation, 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>
<select id="kernel" name="kernel"> <select id="kernel" name="kernel">
examples/image-filter.js
+10 -3
View File
@@ -2,12 +2,19 @@ import Map from '../src/ol/Map.js';
import View from '../src/ol/View.js'; import View from '../src/ol/View.js';
import TileLayer from '../src/ol/layer/Tile.js'; import TileLayer from '../src/ol/layer/Tile.js';
import {fromLonLat} from '../src/ol/proj.js'; import {fromLonLat} from '../src/ol/proj.js';
import BingMaps from '../src/ol/source/BingMaps.js'; import XYZ from '../src/ol/source/XYZ.js';
const key = 'As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5'; 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 imagery = new TileLayer({ const imagery = new TileLayer({
source: new BingMaps({key: key, imagerySet: 'Aerial'}) source: new XYZ({
attributions: attributions,
url: 'https://api.maptiler.com/tiles/satellite/{z}/{x}/{y}.jpg?key=' + key,
maxZoom: 20,
crossOrigin: ''
})
}); });
const map = new Map({ const map = new Map({