30:T18d9,viewof Maine = { const container = html`

`; let resolve; container.value = new Promise(_ => resolve = _); yield container; var map = (container.value = new maplibregl.Map({ boxZoom: true, pitch: 0, bearing: 0, maplibreLogo: true, container, center: [-69, 45], zoom: 6, style: "https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json", scrollZoom: true })); map.on("data", function () { map.addSource("CTE", { type: "geojson", data: CTEGeoJson }); map.addLayer({ id: "CTE-circles", type: "circle", source: "CTE", layout: {}, paint: { 'circle-color': 'red', 'circle-opacity': 0.75, 'circle-radius': 6, } }); // Create a popup, but don't add it to the map yet. var popup = new maplibregl.Popup({ closeButton: false, closeOnClick: false }); map.on('mouseenter', 'CTE-circles', function (e) { // Change the cursor style as a UI indicator. map.getCanvas().style.cursor = 'pointer'; var coordinates = e.features[0].geometry.coordinates.slice(); var Name = e.features[0].properties.Name; // Populate the popup and set its coordinates // based on the feature found. popup.setLngLat(coordinates).setHTML('' + Name + '').addTo(map); }); map.on('mouseleave', 'CTE-circles', function () { map.getCanvas().style.cursor = ''; popup.remove(); }); map.addSource("companies", { type: "geojson", data: CompaniesGeoJson }); map.addLayer({ id: "company-circles", type: "circle", source: "companies", layout: {}, paint: { 'circle-color': 'blue', 'circle-opacity': 0.75, 'circle-radius': 6, } }); map.on('mouseenter', 'company-circles', function (e) { // Change the cursor style as a UI indicator. map.getCanvas().style.cursor = 'pointer'; var coordinates = e.features[0].geometry.coordinates.slice(); var Name = e.features[0].properties.Name; // Populate the popup and set its coordinates // based on the feature found. popup.setLngLat(coordinates).setHTML('' + Name + '').addTo(map); }); map.on('mouseleave', 'company-circles', function () { map.getCanvas().style.cursor = ''; popup.remove(); }); map.addSource("STEM", { type: "geojson", data: STEMGeoJson }); map.addLayer({ id: "STEM-circles", type: "circle", source: "STEM", layout: {}, paint: { 'circle-color': 'yellow', 'circle-opacity': 0.75, 'circle-radius': 6, } }); map.on('mouseenter', 'STEM-circles', function (e) { // Change the cursor style as a UI indicator. map.getCanvas().style.cursor = 'pointer'; var coordinates = e.features[0].geometry.coordinates.slice(); var Name = e.features[0].properties.Name; // Populate the popup and set its coordinates // based on the feature found. popup.setLngLat(coordinates).setHTML('' + Name + '').addTo(map); }); map.on('mouseleave', 'STEM-circles', function () { map.getCanvas().style.cursor = ''; popup.remove(); }); map.addSource("Academies", { type: "geojson", data: AcademiesGeoJson }); map.addLayer({ id: "Academies-circles", type: "circle", source: "Academies", layout: {}, paint: { 'circle-color': 'green', 'circle-opacity': 0.75, 'circle-radius': 6, } }); map.on('mouseenter', 'Academies-circles', function (e) { // Change the cursor style as a UI indicator. map.getCanvas().style.cursor = 'pointer'; var coordinates = e.features[0].geometry.coordinates.slice(); var Name = e.features[0].properties.Name; // Populate the popup and set its coordinates // based on the feature found. popup.setLngLat(coordinates).setHTML('' + Name + '').addTo(map); }); map.on('mouseleave', 'Academies-circles', function () { map.getCanvas().style.cursor = ''; popup.remove(); }); map.addSource("Colleges", { type: "geojson", data: CollegesGeoJson }); map.addLayer({ id: "Colleges-circles", type: "circle", source: "Colleges", layout: {}, paint: { 'circle-color': 'orange', 'circle-opacity': 0.75, 'circle-radius': 6, } }); map.on('mouseenter', 'Colleges-circles', function (e) { // Change the cursor style as a UI indicator. map.getCanvas().style.cursor = 'pointer'; var coordinates = e.features[0].geometry.coordinates.slice(); var Name = e.features[0].properties.Name; // Populate the popup and set its coordinates // based on the feature found. popup.setLngLat(coordinates).setHTML('' + Name + '').addTo(map); }); map.on('mouseleave', 'Colleges-circles', function () { map.getCanvas().style.cursor = ''; popup.remove(); }); map.addSource("CC", { type: "geojson", data: CCGeoJson }); map.addLayer({ id: "CC-circles", type: "circle", source: "CC", layout: {}, paint: { 'circle-color': 'purple', 'circle-opacity': 0.75, 'circle-radius': 6, } }); map.on('mouseenter', 'CC-circles', function (e) { // Change the cursor style as a UI indicator. map.getCanvas().style.cursor = 'pointer'; var coordinates = e.features[0].geometry.coordinates.slice(); var Name = e.features[0].properties.Name; // Populate the popup and set its coordinates // based on the feature found. popup.setLngLat(coordinates).setHTML('' + Name + '').addTo(map); }); map.on('mouseleave', 'CC-circles', function () { map.getCanvas().style.cursor = ''; popup.remove(); }); resolve(map); // Expose the Map instance as the view’s value. invalidation.then(() => map.remove()); }); map.addControl(new maplibregl.NavigationControl()); return map }31:[{"id":"976c79f5edcff0ed870c4f89dd41dae2d1349c32d74268111365e918e5aa67dcf89fdae8e1e43b9c454e8dc39d923d7dd921d49cb5df4a7f732c2779ca3cb4cb","href":"https://static.observableusercontent.com/files/976c79f5edcff0ed870c4f89dd41dae2d1349c32d74268111365e918e5aa67dcf89fdae8e1e43b9c454e8dc39d923d7dd921d49cb5df4a7f732c2779ca3cb4cb","name":"Dummy with Coords.xlsx","type":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet","lastModified":1669751974682.615,"size":29261}] 2e:{"title":"Bioscience Map of Maine","cells":[{"id":0,"value":"# Bioscience Map of Maine","pinned":false,"hidden":false,"mode":"md"},{"id":129,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":229,"value":"viewof select","pinned":true,"hidden":false,"mode":"ojs"},{"id":121,"value":"# Data\n* To update data for this visualization, a new file must be attached and included in the following cell. Ensure all variable names are unchanged and the structure of the data within the excel document remains the same.","pinned":false,"hidden":false,"mode":"md"},{"id":73,"value":"data = FileAttachment(\"Dummy with Coords.xlsx\").xlsx()","pinned":false,"hidden":false,"mode":"ojs"},{"id":245,"value":"# Data Processing","pinned":false,"hidden":false,"mode":"md"},{"id":75,"value":"CTE = data.sheet(\"Maine CTEs\", {headers: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":90,"value":"CTEGeoJson = {\n return {\n type: \"FeatureCollection\",\n features: CTE.map((d) => {\n return {\n type: \"Feature\",\n geometry: { type: \"Point\", coordinates: [d.Longitude, d.Latitude] },\n properties: d\n }\n })\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":79,"value":"Companies = data.sheet(\"Companies\", {headers: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":92,"value":"CompaniesGeoJson = {\n return {\n type: \"FeatureCollection\",\n features: Companies.map((d) => {\n return {\n type: \"Feature\",\n geometry: { type: \"Point\", coordinates: [d.Longitude, d.Latitude] },\n properties: d\n }\n })\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":82,"value":"STEM = data.sheet(\"Maine STEM Schools\", {headers: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":94,"value":"STEMGeoJson = {\n return {\n type: \"FeatureCollection\",\n features: STEM.map((d) => {\n return {\n type: \"Feature\",\n geometry: { type: \"Point\", coordinates: [d.Longitude, d.Latitude] },\n properties: d\n }\n })\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":84,"value":"Academies = data.sheet(\"Academies\", {headers: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":104,"value":"AcademiesGeoJson = {\n return {\n type: \"FeatureCollection\",\n features: Academies.map((d) => {\n return {\n type: \"Feature\",\n geometry: { type: \"Point\", coordinates: [d.Longitude, d.Latitude] },\n properties: d\n }\n })\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":86,"value":"Colleges = data.sheet(\"Colleges\", {headers: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":109,"value":"CollegesGeoJson = {\n return {\n type: \"FeatureCollection\",\n features: Colleges.map((d) => {\n return {\n type: \"Feature\",\n geometry: { type: \"Point\", coordinates: [d.Longitude, d.Latitude] },\n properties: d\n }\n })\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":88,"value":"CommunityColleges = data.sheet(\"Community Colleges\", {headers: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":112,"value":"CCGeoJson = {\n return {\n type: \"FeatureCollection\",\n features: CommunityColleges.map((d) => {\n return {\n type: \"Feature\",\n geometry: { type: \"Point\", coordinates: [d.Longitude, d.Latitude] },\n properties: d\n }\n })\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":187,"value":"# Filters","pinned":false,"hidden":false,"mode":"md"},{"id":189,"value":"Filter_CTE = Maine.setFilter('CTE-circles',['has', select]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":192,"value":"Filter_Companies = Maine.setFilter('company-circles',['has', select]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":195,"value":"Filter_STEM = Maine.setFilter('STEM-circles',['has', select]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":197,"value":"Filter_Academies = Maine.setFilter('Academies-circles',['has', select]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":201,"value":"Filter_Colleges = Maine.setFilter('Colleges-circles',['has', select]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":204,"value":"Filter_CC = Maine.setFilter('CC-circles',['has', select]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":250,"value":"# Dependencies","pinned":false,"hidden":false,"mode":"md"},{"id":221,"value":"import {viewof select} from \"6703cfce2eceff50\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":131,"value":"maplibregl = require(\"maplibre-gl@2.1.9\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":133,"value":"","pinned":true,"hidden":false,"mode":"html"}],"files":"$W31","stdlib":"1","titling":"auto"}