|
| 1 | +// Initialize the map and set its view to a specific location and zoom level |
| 2 | +var map = L.map("map").setView([39.754, -75.588], 5); |
| 3 | + |
| 4 | +// Add a tile layer (map background) from OpenStreetMap |
| 5 | +L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { |
| 6 | + maxZoom: 19, |
| 7 | + attribution: |
| 8 | + '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors', |
| 9 | +}).addTo(map); |
| 10 | + |
| 11 | +// Add a marker to the map |
| 12 | +var marker = L.marker([39.754, -75.588]) |
| 13 | + .addTo(map) |
| 14 | + .bindTooltip("Charter School of Wilmington", { |
| 15 | + permanent: false, |
| 16 | + direction: "top", |
| 17 | + offset: [0, -10], |
| 18 | + }); |
| 19 | + |
| 20 | +var googleSheetUrl = |
| 21 | + "https://docs.google.com/spreadsheets/d/e/2PACX-1vQeetniEzIb5VYYipz4mgbbg1LKT5FCOLvZ3zr-T4EKU-1L7TQQNJLq4BDokQu9OFx2Jh9mkRsswMzh/pub?gid=0&single=true&output=csv"; |
| 22 | + |
| 23 | +Papa.parse(googleSheetUrl, { |
| 24 | + download: true, // Fetch the file |
| 25 | + header: true, |
| 26 | + complete: function (results) { |
| 27 | + var universities = results.data; // Array of university objects |
| 28 | + |
| 29 | + // Add red dot markers with tooltips |
| 30 | + for (var i = 0; i < universities.length; i++) { |
| 31 | + var uni = universities[i]; |
| 32 | + // Ensure coordinates are numbers |
| 33 | + var lat = parseFloat(uni.latitude); |
| 34 | + var lon = parseFloat(uni.longitude); |
| 35 | + |
| 36 | + if (!isNaN(lat) && !isNaN(lon)) { |
| 37 | + // Check for valid coordinates |
| 38 | + L.circleMarker([lat, lon], { |
| 39 | + radius: 5, |
| 40 | + fillColor: "#ff0000", |
| 41 | + color: "#ff0000", |
| 42 | + weight: 1, |
| 43 | + opacity: 1, |
| 44 | + fillOpacity: 0.8, |
| 45 | + }) |
| 46 | + .addTo(map) |
| 47 | + .bindTooltip(uni.college_name, { |
| 48 | + permanent: false, |
| 49 | + direction: "top", |
| 50 | + offset: [0, -10], |
| 51 | + }); |
| 52 | + } |
| 53 | + } |
| 54 | + |
| 55 | + // Fit the map to show all markers |
| 56 | + var group = new L.featureGroup( |
| 57 | + universities |
| 58 | + .filter( |
| 59 | + (u) => |
| 60 | + !isNaN(parseFloat(u.latitude)) && !isNaN(parseFloat(u.longitude)) |
| 61 | + ) |
| 62 | + .map((u) => |
| 63 | + L.circleMarker([parseFloat(u.latitude), parseFloat(u.longitude)], { |
| 64 | + radius: 5, |
| 65 | + }) |
| 66 | + ) |
| 67 | + ); |
| 68 | + map.fitBounds(group.getBounds()); |
| 69 | + }, |
| 70 | + error: function (error) { |
| 71 | + console.error("Error fetching Google Sheet:", error); |
| 72 | + }, |
| 73 | +}); |
0 commit comments