2016-12-05 4 views
1

ポリゴンレイヤーがあり、データベースからロードしました。私はすべてのポリゴン名onmouseoverポリゴンを表示したいと思います。最初にポリゴンの中心に追加しました。ポリゴンスタイルの場合と同じように、onmousoverに変更します。私はリーフレットには新しく、onmouseoverに変更する方法を教えてください。リーフレットのマウスオーバー時にデータベースからポリゴンにラベルを追加するには

var BoundariesLayer = L.geoJson(
    Boundaries, { 
     style: boundariesStyle, 
     onEachFeature: boundariesOnEachFeature 
    }).addTo(mymap); 
mymap.fitBounds(BoundariesLayer.getBounds()); 
var markers = new Array(); 

function boundariesOnEachFeature(feature, layer) { 
    markers.push(
     L.circleMarker(
      layer.getBounds().getCenter(), { 
       radius: 0.0, 
       opacity: 0, 
       fillOpacity: 0 
      } 
     ) 
    ); 
    var markersCount = markers.length; 
    markers[markersCount - 1].bindTooltip(
     feature.properties.NAME_3, { 
      permanent: true, 
      className: "my-label", 
      direction: 'center' 
     } 
    ); 
    markers[markersCount - 1].addTo(mymap); 
    markers[markersCount - 1].hideLabel(); 

    layer.on({ 
     mouseover: highlightFeature, 
     mouseout: resetHighlight, 
     click: zoomToFeature 
    }); 
} 

function highlightFeature(e) { 
    var layer = e.target; 
    layer.setStyle({ 
     weight: 3, 
     color: 'rgb(73,133,73)', 
     fillColor: 'rgb(73,133,73)', 
     fillOpacity: 0.2 
    }); 
} 

function resetHighlight(e) { 
    BoundariesLayer.resetStyle(e.target); 

} 

function zoomToFeature(e) { 
    mymap.fitBounds(e.target.getBounds()); 
} 
+0

I編集しなくても簡単にコメントを追加できます) – nrhode

答えて

0

PUHのコードは少し厄介です。

CircleMarkersで何をしようとしているのですか?

function newFunction(){ 
    console.log("MY NEW FUNCTION"); 
} 

そして、これまでお使いのマウスオーバーイベントを変更します:あなたは、単にこれを行うことができます第2の機能を追加するために

function boundariesOnEachFeature(feature, layer) { 
    //CREATE POPUP 
    var popup = new L.Popup({ 
    autoPan: false, 
     keepInView: true, 
     //WHATEVER YOU LIKE 
    }).setContent(feature.properties.NAME_3); 

    var bounds = layer.getBounds(); 
    // Get center of bounds 
    var center = bounds.getCenter(); 

    popup.setLatLng(center); 

    //BIND POPUP TO LAYER 
    layer.bindPopup(popup); 

    //SET MOUSE EVENTS 
    layer.on({ 
    mouseover: function() { 
     layer.openPopup(); 
    }, 
    mouseout: function() { 
     layer.closePopup() 
     } 
    }); 
} 

//:

ことは、これを試してみてください

mouseover: function() { 
    layer.openPopup(); 
    newFunction(); 
} 
+0

申し訳ありません "var popup = new L.Popup"を設定するのを忘れました。 – nrhode

関連する問題