Question

考虑到自定义平面图显示了带有从geojson文件加载的标记的传单。每个标记具有相关页面，并且那些页面具有针对地图的超链接。我想将#id添加到那些超链接。

例如，如果地图网址是domain.com/map，则“标记1”页面（domain.com/marker-1）将会打开一个链接（domain.com/map#maker-1）地图中心带有“标记1”实际标记的地图，其弹出窗口打开。

我的问题是如何在中心打开带有某个标记的地图，并在我向网址添加哈希值时打开弹出窗口（domain.com/map#maker-1）？

这是我的代码：

的index.php

<head>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js" />
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" /> 
    <script src="geojson.js" type="text/javascript"></script>
</head>
<body>  
    <div id="map"></div>
    <script src="map.js"></script>
</body>

geojson.js

var groupsGeoJson = {
    "type": "FeatureCollection",
    "features":[
        {
            "geometry": {
                "type": "Point",
                "coordinates": [-120,60]
            },
            "type": "Feature",
            "properties": {
                "popupContent": "<h1>Maker 1</h1>"
            },
            "id": 1
        },
        {
            "geometry": {
                "type": "Point",
                "coordinates": [-80,40]
            },
            "type": "Feature",
            "properties": {
                "popupContent": "<h1>Maker 2</h1>"
            },
            "id": 2
        }
    ]
};

map.js

var mapMinZoom = 2;
var mapMaxZoom = 6;
var mapIniZoom = 2;
var mapCenterLat = 20;
var mapCenterLng = -75;

var groupsIcon = L.icon({
  iconUrl: 'images/silver_coin.gif',
  iconSize: [32, 32],
  iconAnchor: [16, 32],
  popupAnchor: [0, -28]
});

var baseLayer = new L.TileLayer('layers/baseLayer/{z}/{x}/{y}.png', {           
    minZoom: mapMinZoom, 
    maxZoom: mapMaxZoom,
    noWrap: true
}); 

var groups= L.geoJson(groupsGeoJson, {
  pointToLayer: function (feature, latlng) {
    return L.marker(latlng, {icon: groupsIcon});
  }, onEachFeature: onEachFeature
});

var map = new L.Map('map', {
  layers: [baseLayer, groups],
  center: new L.LatLng(mapCenterLat, mapCenterLng),
  zoom: mapIniZoom     
});

var southWest = map.unproject([0, 16384], map.getMaxZoom());
var northEast = map.unproject([16384, 0], map.getMaxZoom());  
var mapBounds = new L.LatLngBounds(southWest,northEast);    

map.setMaxBounds(mapBounds);

function onEachFeature(feature, layer) {
  var popupContent = "<p>Test</p>"
  if (feature.properties && feature.properties.popupContent) {
    popupContent += feature.properties.popupContent;
  }
  layer.bindPopup(popupContent);
}

如何通过外部链接打开传单上的标记弹出窗口

0 个答案: