2

我正在尝试按照此处给出的 Leaflet 程序 以及一个很好的工作示例来自动定位我的 Ionic 应用程序中的使用。但是，我很难找到正确的语法来嵌入传单页面上给出的代码。谢谢你的帮助。

编辑解决方案：简单的方法是在 Angular中使用“中心自动发现”指令

JS

.controller('MapCtrl', function($scope, leafletEvents) {
var map = L.map('map');
$scope.eventStatus = 'Map View';

angular.extend($scope, {
    defaults: {
        tileLayer: "http://{s}.tile.stamen.com/toner-lite/{z}/{x}/{y}.png",
        maxZoom: 18,
        path: {
            weight: 10,
            color: '#800000',
            opacity: 1
        }
    },
    });

 function onLocationFound(e) {
        var radius = e.accuracy / 2;

        L.marker(e.latlng).addTo(map)
            .bindPopup("You are within " + radius + " meters from this point").openPopup();

        L.circle(e.latlng, radius).addTo(map);
    }

    function onLocationError(e) {
        alert(e.message);
    }

    map.on('locationfound', onLocationFound);
    map.on('locationerror', onLocationError);

    map.locate({setView: true, maxZoom: 16});


});

HTML：

    <ion-list>  
        <ion-item class="leaflet_custom_container">
            <div class="" ng-controller="MapCtrl" > <!-- -->
                <div id="map" data-tap-disabled="true"   >
                    <leaflet  defaults="defaults" height="450px" width="600px"  >
                    </leaflet>

            </div>
        </ion-item>
    </ion-list>
4

0 回答 0