Добавление объектов на карту в OpenLayers 5 - PullRequest
Новая
       7

Добавление объектов на карту в OpenLayers 5

0 голосов
/ 24 августа 2018

У меня есть следующий код в HTML 

<html>
<head>
<title>Vector Style Examples</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.1.3/css/ol.css">
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Teko" rel="stylesheet"> 
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.1.3/build/ol.js"></script>
</head>
<body>
<div id="map" class="map"></div>
<script>
var map = new ol.Map({
    view: new ol.View({center: ol.proj.transform([16.9278, 52.4044], 'EPSG:4326', 'EPSG:3857'), zoom:12}),
    layers: [new ol.layer.Tile({
            source: new ol.source.OSM()
    })],
    target:'map'
});

var marker = new ol.Feature({
    geometry: new ol.geometry.point(ol.proj.transform([16.9071388, 52.4901917], 'EPSG:4326', 'EPSG:3857')),
});

var markers = new ol.source.Vector({
    features: [marker]
});

var markerVectorLayer = new ol.layer.Vector({
    source: markers,
});
map.addLayer(markerVectorLayer);

</script>
</body>
</html>

Это не отображение каких-либо точек, только карта.В консоли я получаю сообщение об ошибке «ol.geom.point не является конструктором».Этот код в основном основан на этом уроке https://medium.com/attentive-ai/working-with-openlayers-4-part-2-using-markers-or-points-on-the-map-f8e9b5cae098

Ответы [ 3 ]

0 голосов
/ 25 августа 2018

ОК, я знаю, почему это не сработало. Вы должны ввести «ol.geom.Point» вместо «ol.geom.point» (в верхнем регистре).

0 голосов
/ 23 ноября 2018

Изменить это 

 ol.geometry.point

к этому 

ol.geometry.Point

и это будет работать.

0 голосов
/ 24 августа 2018

Измените 

var marker = new ol.Feature({
    geometry: new ol.geometry.point(ol.proj.transform([16.9071388, 52.4901917], 'EPSG:4326', 'EPSG:3857')),
});

на 

var marker = new ol.Feature({
    geometry: new ol.geom.Point(ol.proj.transform([16.9071388, 52.4901917], 'EPSG:4326', 'EPSG:3857')),
});

и измените масштаб изображения с 12 на 11 в представлении (в противном случае точка находится здесь, но за пределами исходного вида, и вам нужночтобы уменьшить масштаб)

PS: Не уверен, где вы взяли ol.geometry.point, поскольку это никогда не упоминалось в учебнике, на который вы ссылались

...