I am trying to load a base map (streets) and have a feature layer from the arcGIS online system. I can view the base map, but I am receiving a few errors when i try to combine the base map and feature layer.
Here is my code...
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>ArcGIS DevLabs: JavaScript Starter App</title>
<style>
html, body, #viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
.esri-feature {
letter-spacing: 0em;
font-family: "Avenir Next", "Helvetica Neue", sans-serif;
line-height: 1.55rem;
font-feature-settings: "liga"1, "calt"0;
background: #fff;
padding: 1em;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.9/esri/css/main.css">
<script src="https://js.arcgis.com/4.9/"></script>
<script>
require([
"esri/WebMap",
"esri/Map",
"esri/layers/FeatureLayer",
"esri/views/MapView",
"esri/widgets/Search",
"esri/widgets/Feature",
"dojo/domReady!"
], function (WebMap, Map, FeatureLayer, MapView, Search, Feature) {
const fLayer = new FeatureLayer({
portalItem: {
id: "52a26407bcb244ac9a29acf64aab4d0b"
}
});
var map = new Map({
basemap: "streets",
layers: [fLayer]
});
var view = new MapView({
container: "viewDiv",
map: map,
center: [-77.0487, 38.8935],
zoom: 18
});
var search = new Search({
enableButtonMode: true,
enableLabel: false,
enableInfoWindow: true,
showInfoWindowOnSelect: false,
view: view
});
view.ui.add(search, "top-right"); // Add to the map
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
What am i missing??