| Widget |
Preview |
 |
 |
I wanted to try inserting a map.
It works in the preview, but when I insert it, nothing appears.
Below is the code I tested:
Html:
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<div id="map"></div>
Css:
body {
margin: 0;
font-family: Arial, sans-serif;
background-color:rgb(67, 179, 245);
}
#map {
height: 100vh;
width: 100%;
}
Js:
const seoul = [37.5665, 126.9780];
const busan = [35.1796, 129.0756];
const map = L.map('map').setView([36.5, 128.5], 6);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap'
}).addTo(map);
L.marker(seoul)
.addTo(map)
.bindPopup("Seoul");
L.marker(busan)
.addTo(map)
.bindPopup("Busan");
const line = L.polyline([seoul, busan], {
color: 'red',
weight: 4
}).addTo(map);
I wanted to try inserting a map.
It works in the preview, but when I insert it, nothing appears.
Below is the code I tested:
Html:
Css:
Js: