I want to use a UK map as a basemap, overlay it with the UK county boundaries and plot client data points. As a simple example I will be showing a map of Shropshire (for example) with a number of sites (typically nature reserves) shown as points on the map. The client data for the location of these sites will be held in a MySQL database.
I have so far been able to construct the map using a WTMS layer from the Ordnance Survey Data Hub. The code for this and the screenshot of the result is shown below (minus my API key).
I know that I cannot plot points directly on to a WTMS layer but instead need to use another layer (Graphics?, Feature?) but I am struggling to work out how to do this. I do realise that I need to use the same spatial reference (27700) but I am not experienced enough to know how to begin. Any help would be really appreciated.
Here is my script
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/WMTSLayer",
"esri/layers/FeatureLayer",
"esri/layers/Layer",
"esri/geometry/Point",
"esri/geometry/SpatialReference",
"esri/core/watchUtils",
"dojo/domReady!",
], function (
Map,
MapView,
WMTSLayer,
FeatureLayer,
Layer,
Point,
SpatialReference,
watchUtils
) {
// Replace INSERT_API_KEY_HERE with your API key.
var apiKey = "";
// Create the wmts layer and add to the view.
var tileLayer = new WMTSLayer({
url: serviceUrl,
serviceMode: "KVP",
activeLayer: {
id: "Outdoor_27700",
},
customParameters: {
key: apiKey,
},
});
var view = new MapView({
container: "viewDiv",
map: new Map({
layers: [tileLayer],
}),
scale: 459392,
center: new Point({
x: 349193,
y: 312712,
spatialReference: new SpatialReference({ wkid: 27700 }),
}),
constraints: {
minScale: 3386450,
maxScale: 6614,
rotationEnabled: false,
},
});
// map.add(layer);
});
</script>
And the result is attached
