diff --git a/src/components/App.jsx b/src/components/App.jsx
index 61b2ea7..780470b 100644
--- a/src/components/App.jsx
+++ b/src/components/App.jsx
@@ -1,5 +1,6 @@
import React from 'react'
import Mousetrap from 'mousetrap'
+import url from 'url'
import MapboxGlMap from './map/MapboxGlMap'
import OpenLayers3Map from './map/OpenLayers3Map'
@@ -71,6 +72,8 @@ export default class App extends React.Component {
Debug.set("maputnik", "styleStore", this.styleStore);
}
+ const queryObj = url.parse(window.location.href, true).query;
+
this.state = {
errors: [],
infos: [],
@@ -80,6 +83,7 @@ export default class App extends React.Component {
vectorLayers: {},
inspectModeEnabled: false,
spec: styleSpec.latest,
+ mapFilter: queryObj["color-blindness-emulation"],
}
this.layerWatcher = new LayerWatcher({
@@ -266,15 +270,25 @@ export default class App extends React.Component {
const metadata = this.state.mapStyle.metadata || {}
const renderer = metadata['maputnik:renderer'] || 'mbgljs'
+ let mapElement;
+
// Check if OL3 code has been loaded?
if(renderer === 'ol3') {
- return
+ mapElement =
} else {
- return
}
+
+ const elementStyle = {
+ "filter": `url('#${this.state.mapFilter}')`
+ };
+
+ return
+ {mapElement}
+
}
onLayerSelect(layerId) {
diff --git a/src/template.html b/src/template.html
index bfa8284..268f229 100644
--- a/src/template.html
+++ b/src/template.html
@@ -69,6 +69,87 @@
+
+
+
+