html,
body {
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
}

#viewDiv {
	height: 100%;
	width: 100%;
}

import config from "https://js.arcgis.com/next/@arcgis/core/config.js";
import ArcGISMap from "https://js.arcgis.com/next/@arcgis/core/Map.js";
import MapView from "https://js.arcgis.com/next/@arcgis/core/views/MapView.js";
import GeoJSONLayer from "https://js.arcgis.com/next/@arcgis/core/layers/GeoJSONLayer.js";

config.request.interceptors.push({
	urls: 'https://earthquake.usgs.gov',
	after(response) {
		const geojson = response.data;
		geojson.features = geojson.features.splice(1, 500);
		response.data = geojson;
		return response;
	}
});

const layer = new GeoJSONLayer({
	url: `https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.geojson`,
	id: "buildingPoints",
	title: "Indoor Maps Locations",
	displayField: "siteName",
	renderer: {
		type: "simple",
		symbol: {
			type: "simple-marker",
			style: "square",
			color: "blue",
			size: "8px"
		}
	},
	geometryType: "point"
});

const map = new ArcGISMap({
	basemap: "gray-vector",
	layers: [layer]
});

const view = new MapView({
	container: "viewDiv",
	map,
	center: [-118, 34],
	zoom: 4
});