我想在我的开放地图上有一些坐标

时间:2018-03-02 20:34:57

标签: javascript jquery

我正在尝试使用Openlayer在我的地图上获得一些点。地图工作正常。我有一个经度和纬度的JSON文件,我希望它们出现在我的地图上。但它没有用。解析不会以某种方式工作。

错误1:
Error 1

错误2:
Error 2

JSON文件:https://github.com/CodeforChemnitz/Haltestellen/blob/gh-pages/haltestellen.json

我的代码:

 <div class="main-container-cvag">

        <div id="map" class="map"></div>
        <script src="https://openlayersbook.github.io/openlayers_book_samples/assets/ol3/js/ol.js"></script>
        <script>

            // Declare a Tile layer with an openstreetmap
            var osmLayer = new ol.layer.Tile({
                source: new ol.source.OSM()
            });
            // latitude and longitude to Chemnitz projection
            var chemnitz = ol.proj.transform([12.9213697, 50.827845], 'EPSG:4326', 'EPSG:3857');

            // Create a View, set it center and zoom level
            var view = new ol.View({
                center: chemnitz,
                zoom: 13
            });

            //source
            var chemnitzStationSource = new ol.source.Vector();

            //dot style
            function dotstyle(feature) {
                var style = new ol.style.Style({
                    image: new ol.style.Circle({
                        radius: 6,
                        stroke: new ol.style.Stroke({
                            color: 'white',
                            width: 2
                        }),
                        fill: new ol.style.Fill({
                            color: 'green'
                        })
                    })
                });
                return [style];
            }

            //new layer
            var chemnitzStations = new ol.layer.Vector({

                source: chemnitzStationSource,
                style: dotstyle
            })

            //new Map
            var map = new ol.Map({
                target: 'map',
                layers: [osmLayer, chemnitzStations],
                view: view
            });

            $.ajax({

                url: "haltestellen.json",
                dataType: "jsonp",
                crossDomain: true,
                success: function(data) {

                    var transform = ol.proj.getTransform('EPSG:4326', 'EPSG:3857');

                    data.items.forEach(function (item) {

                        var feature = new ol.Feature(item);
                        feature.set('url', item.stations);
                        var coordinate = transform([parseFloat(item.longitude), parseFloat(item.latitude)]);
                        var geometry = new ol.geom.Point(coordinate);
                        feature.setGeometry(geometry);
                        chemnitzStationSource.addFeature(feature);
                        console.log(parseFloat(item.longitude));

                    });

                }

            });

            map.addLayer(osmLayer);
            // Set the view for the map
            map.setView(view);


        </script>

    </div>

有人可以帮我做什么吗? :)

0 个答案:

没有答案