Я пытался использовать Google API, чтобы сделать карту на моем сайте, однако, чтобы использовать это сейчас, вы должны заплатить немало.В любом случае, я нашел API OpenLayers и его классное приложение, но все же, когда я запрашиваю карту в центре моего текущего местоположения, карта больше не отображается .-.Я не получаю ошибок в своей консоли, и я даже использовал обещания, поэтому карта начнет рендерить, как только я получу координаты.
это мой код index.js
import 'ol/ol.css';
import { Map, View } from 'ol';
import TileLayer from 'ol/layer/Tile';
import OSM from 'ol/source/OSM';
var lng;
var lat;
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
lat = Promise.resolve(position.coords.latitude);
lng = Promise.resolve(position.coords.longitude);
Promise.all([lat, lng]).then((res) => {
console.log(res);
const map = new Map({
target: 'map',
layers: [
new TileLayer({
source: new OSM()
})
],
view: new View({
center: [lat, lng],
zoom: 0
})
});
})
})
}
И этомой HTML-код
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Using Parcel with OpenLayers</title>
<style>
#map {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script src="./index.js"></script>
</body>
</html>
, чтобы запустить все это, я использую узел, и если я получу карту констант из условной, карта будет отображаться, однако это не будет центр, который я хочу видеть:D