将标记放在OpenLayers中的Geolocation-不起作用

Question

I've tried to put an IconFeature at my location using the Geolocation-class in OpenLayers. 我试图使用OpenLayers中的Geolocation类将IconFeature在我的位置。 The Geolocation function worked for a while but I haven't been able to put the marker at my location. 地理位置定位功能已经工作了一段时间，但我无法将标记放置在我的位置。 I've followed a dozens of examples but still can't figure it out. 我已经遵循了许多示例，但仍然无法弄清楚。 All layers work but not the geolocation function. 所有图层均有效，但地理定位功能无效。 What am I doing wrong? 我究竟做错了什么？

    <!doctype html>
    <html lang="en">
      <head>
        <link rel="stylesheet" href="http://openlayers.org/en/v3.10.1/css/ol.css" type="text/css">

        <script src="http://openlayers.org/en/v3.10.1/build/ol.js" type="text/javascript"></script>
        <title>OpenLayers 3 example</title>
      </head>
      <body>
        <h2>My Map</h2>

        <div id="map" class="map">

   <script type="text/javascript">

            var olmap = new ol.Map({
                target: 'map',
                layers: layers,
                view: new ol.View({
                    center: [0, 0],
                    zoom: 1
            });

        var geolocation = new ol.Geolocation({
            tracking: true
        });

        geolocation.on('change', function (evt) {
            //save position and set map center
            var coords = geolocation.getPosition();
            olmap.getView().setCenter(coords);

            var iconFeature = new ol.Feature({
                geometry: new ol.geom.Point(pos)
            });
            var vectorSource = new ol.source.Vector({
                features: [iconFeature]
            });
            var vectorLayer = new ol.layer.Vector({
                source: vectorSource
            });


        var layers = [];
        layers[0] = new ol.layer.Tile({ source: new ol.source.MapQuest({ layer: 'sat' }) });
        layers[1] = new ol.layer.Tile({ source: new ol.source.OSM() });
        layers[2] = new ol.layer.Tile({
            source: new ol.source.TileWMS({
                url: 'http://localhost:8122/geoserver/topp/wms?',
                params: { LAYERS: 'states', VERSION: '1.1.0' }
            })
        });
        layers[3] = vectorLayer;

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

Answer 1

Your code is a bit confusing, but it can be as simple as this: 您的代码有点混乱，但是可以像这样简单：

http://jsfiddle.net/jonataswalker/cLkuf5mt/ http://jsfiddle.net/jonataswalker/cLkuf5mt/

var iconFeature = new ol.Feature({
  geometry: new ol.geom.Point([])
});

var source = new ol.source.Vector({
  features: [iconFeature]
});
var vector = new ol.layer.Vector({
  source: source
});

var map = new ol.Map({
  target: document.getElementById('map'),
  view: new ol.View({
    center: [0, 0],
    zoom: 4,
    minZoom: 2,
    maxZoom: 20
  }),
  layers: [
    new ol.layer.Tile({
      source: new ol.source.MapQuest({layer: 'osm'})
    }),
    vector
  ]
});

var geolocation = new ol.Geolocation({
  tracking: true,
  projection: map.getView().getProjection()
});

geolocation.on('change', function(evt) {
  var coord = geolocation.getPosition();
  iconFeature.getGeometry().setCoordinates(coord);
  map.getView().setCenter(coord);
});

将标记放在OpenLayers中的Geolocation-不起作用

问题描述

1 个解决方案

解决方案1
0 2016-02-24 17:52:04

将标记放在OpenLayers中的Geolocation-不起作用

问题描述

1 个解决方案

解决方案1 0 2016-02-24 17:52:04

解决方案1
0 2016-02-24 17:52:04