Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/clojure/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 单击图层时页面跳转_Javascript_Dictionary_Leaflet - Fatal编程技术网

Javascript 单击图层时页面跳转

Javascript 单击图层时页面跳转,javascript,dictionary,leaflet,Javascript,Dictionary,Leaflet,我有一张传单地图,上面有一组图层。当我滚动地图并单击其中一个复选框时,页面会跳到地图的顶部。为什么会这样 下面是JavaScript: var map = L.map('map', { center: [51.501617,-0.018582], zoom: 14 }); L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', { max

我有一张传单地图,上面有一组图层。当我滚动地图并单击其中一个复选框时,页面会跳到地图的顶部。为什么会这样

下面是JavaScript:

var map = L.map('map', {
    center: [51.501617,-0.018582],
    zoom: 14
});

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
    maxZoom: 18,
    id: 'jeffceriello.nd7obhnh',
    accessToken: 'pk.eyJ1IjoiamVmZmNlcmllbGxvIiwiYSI6Ikhrakxrd00ifQ.SlVngzIXeS5UPC8UGmy1OA'
}).addTo(map);

map.scrollWheelZoom.disable();

// marker
var churchill = L.icon({
    iconUrl: '/img/pin.png',
    shadowUrl: '',

    iconSize:     [43, 64], // size of the icon
    shadowSize:   [0, 0], // size of the shadow
    iconAnchor:   [21, 64], // point of the icon which will correspond to marker's location
    shadowAnchor: [0, 0],  // the same for the shadow
    popupAnchor:  [0, 0] // point from which the popup should open relative to the iconAnchor
});

L.marker([51.503754,-0.014841], {icon: churchill}).addTo(map);

var geojson = {
    "type": "FeatureCollection",
    "features": [
        {
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [-0.014782, 51.504711]
             },
            "properties": {
                "title": "Barclays Bank",
                markerColor: "#6D8AAA"
            }
        },{
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [-0.014618, 51.504648]
            },
            "properties": {
                "title": "Idea Store",
                markerColor: "#6D8AAA"
            }
        },{
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [-0.014532, 51.504556]
            },
            "properties": {
                "title": "James Shoe Care",
                markerColor: "#6D8AAA"
            }
        }
]};

shopping = L.geoJson(geojson, {
    style: function(feature) {
        return {color: feature.properties.markerColor};
    },
    pointToLayer: function(feature, latlng) {
        return new L.CircleMarker(latlng, {radius: 8, fillOpacity: 1, stroke: false});
    },
    onEachFeature: function (feature, layer) {
        layer.bindPopup(feature.properties.title);
    }
});

map.addLayer(shopping);

var geojson2 = {
    "type": "FeatureCollection",
    "features": [
    {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [-0.014546, 51.504319]
        },
        "properties": {
            "title": "Birleys",
            "markerColor": "#6D8AAA"
        }
    }
]};

food = L.geoJson(geojson2, {
    style: function(feature) {
        return {color: feature.properties.markerColor};
    },
    pointToLayer: function(feature, latlng) {
        return new L.CircleMarker(latlng, {radius: 8, fillOpacity: 1, stroke: false});
    },
    onEachFeature: function (feature, layer) {
        layer.bindPopup(feature.properties.title);
    }
});

//map.addLayer(food);

var overlayMaps = {
    "Shopping": shopping,
    "Food & Drink": food
};

var control = L.control.layers(overlayMaps, null, {collapsed: false});
control.addTo(map);
control._container.remove();

document.getElementById('layers').appendChild(control.onAdd(map));

可能是因为您使用了一个用于地图上使用的L.控件,并使用控件对其进行了操作。_container.remove;?如果你想要一个地图外的控件,为什么不编码呢?你能修复它吗。我也有同样的问题