rmcg.dev/projects/apple/mapkit/index.html

49 lines
1.7 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.apple-mapkit.com/mk/5.x.x/mapkit.core.js" crossorigin async data-callback="initMapKit"
data-libraries="map"
data-initial-token="eyJhbGciOiJFUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6IkJHV0M3OTI1V0MifQ.eyJpc3MiOiJWRTdZTTVWVkpCIiwiaWF0IjoxNjY4MzYyMzYzLCJleHAiOjE2OTk4MzM2MDAsIm9yaWdpbiI6Imh0dHBzOi8vKi5ybWNnLmRldiwgaHR0cDovLzEyNy4wLjAuMTozMDAwLCBodHRwOi8vbG9jYWxob3N0OjMwMDAifQ.JOAnDMffZ90tk03qH1BEVCNpFo_-5eaUj1gmTgwHXl0tK-sfA4kVhNQ1UyOUaPuM1SR57rwImhjTiX-mNMwKtA"></script>
<style>
#map {
width: 100%;
height: 600px;
}
</style>
</head>
<body>
<div id="map"></div>
<script type="module">
(async () => {
const tokenID = "eyJhbGciOiJFUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6IkJHV0M3OTI1V0MifQ.eyJpc3MiOiJWRTdZTTVWVkpCIiwiaWF0IjoxNjY4MzYyMzYzLCJleHAiOjE2OTk4MzM2MDAsIm9yaWdpbiI6Imh0dHBzOi8vKi5ybWNnLmRldiwgaHR0cDovLzEyNy4wLjAuMTozMDAwLCBodHRwOi8vbG9jYWxob3N0OjMwMDAifQ.JOAnDMffZ90tk03qH1BEVCNpFo_-5eaUj1gmTgwHXl0tK-sfA4kVhNQ1UyOUaPuM1SR57rwImhjTiX-mNMwKtA";
if (!window.mapkit || window.mapkit.loadedLibraries.length === 0) {
// mapkit.core.js or the libraries are not loaded yet.
// Set up the callback and wait for it to be called.
await new Promise(resolve => { window.initMapKit = resolve });
// Clean up
delete window.initMapKit;
}
mapkit.init({
authorizationCallback: function (done) {
done(tokenID);
}
});
const map = new mapkit.Map("map");
})();
</script>
</body>
</html>