bingマップのポリゴンにclickイベントを追加したい

-2

描画マネージャを使用してポリゴンを描画したいので、編集したいと思います。問題はポリゴンをクリックすると警告メッセージが表示されないことです。クリックイベントが発生していないようです。bingマップのポリゴンにclickイベントを追加したい

var map = new Microsoft.Maps.Map(document.getElementById('myMap'), { 
credentials: 'Your Bing Maps Key' 
}); 
var center = map.getCenter(); 
var nose = new Microsoft.Maps.Pushpin(center, null); 
var polygon1 = new Microsoft.Maps.Polygon([ 
    new Microsoft.Maps.Location(center.latitude + 0.01, center.longitude - 0.03), 
    new Microsoft.Maps.Location(center.latitude + 0.01, center.longitude - 0.11), 
    new Microsoft.Maps.Location(center.latitude + 0.05, center.longitude - 0.07) 
]); 
Microsoft.Maps.Events.addHandler(polygon1, 'click', function() { alert('polygonClick1'); }); 
var polygon2 = new Microsoft.Maps.Polygon([ 
    new Microsoft.Maps.Location(center.latitude + 0.01, center.longitude + 0.03), 
    new Microsoft.Maps.Location(center.latitude + 0.01, center.longitude + 0.11), 
    new Microsoft.Maps.Location(center.latitude + 0.05, center.longitude + 0.07) 
]); 
Microsoft.Maps.Events.addHandler(polygon2, 'click', function() { alert('polygonClick2'); }); 
var mouth = new Microsoft.Maps.Polyline([ 
    new Microsoft.Maps.Location(center.latitude - 0.02, center.longitude - 0.10), 
    new Microsoft.Maps.Location(center.latitude - 0.05, center.longitude - 0.07), 
    new Microsoft.Maps.Location(center.latitude - 0.05, center.longitude + 0.07), 
    new Microsoft.Maps.Location(center.latitude - 0.02, center.longitude + 0.10) 
]); 
Microsoft.Maps.loadModule('Microsoft.Maps.DrawingTools', function() { 
var tools = new Microsoft.Maps.DrawingTools(map); 
    tools.showDrawingManager(function (manager) { 
    manager.setPrimitives([mouth]); 
    manager.add(polygon1); 
    manager.add(polygon2); 
    manager.add(nose); 
}); 
});

出典

2016-09-20 Yashpal S

問題は何ですか？希望する結果と問題を記述してください –

ポリゴンをクリックすると警告メッセージが表示されません。クリックイベントが発生していないようです。 Plsヘルプ –

クリックイベントがポリゴンで機能しています。私はdrawingmanagerでポリゴンをバインドしているときには動作しません。 –

これは、マップではなく図面マネージャにポリゴンを追加しているためです。描画マネージャハンドルは、編集および描画にすべてのマウスイベントを使用し、カスタムイベントをシェイプに追加することを許可しません。描画マネージャー自体には、ここに記載されているように多くのイベントがあります。https://msdn.microsoft.com/en-us/library/mt750462.aspx

これらは既に定義されているため、図面マネージャ/ツールバーを使用する代わりに、DrawingToolsクラスを使用します自分の。ポリゴンを編集するときは、そのポリゴンを編集機能に渡すことができます。おそらく、ユーザーがポリゴンをクリックすると、編集モードになります。その後、ユーザーがescキーを押すと、編集をどのように停止するかを決めることができます。これを行う方法を示すコードサンプルは次のとおりです。

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <script type='text/javascript' 
      src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap' 
      async defer></script> 
    <script type='text/javascript'> 
    var map; 
    var tools; 

    function GetMap() { 
     map = new Microsoft.Maps.Map('#myMap', { 
      credentials: 'Your Bing Maps Key' 
     }); 

     //Load the DrawingTools module. 
     Microsoft.Maps.loadModule('Microsoft.Maps.DrawingTools', function() { 
      //Create an instance of the DrawingTools class and bind it to the map. 
      tools = new Microsoft.Maps.DrawingTools(map); 
     }); 

     //Create a random 5 sided polyogn that fills a decent portion of the map. 
     var polygon = Microsoft.Maps.TestDataGenerator.getPolygons(1, map.getBounds(), 5, 0.8); 
     map.entities.push(polygon); 

     //When the polygon is clicked, go into edit mode. 
     Microsoft.Maps.Events.addHandler(polygon, 'click', function() { 
      //Remove the polygon from the map as the drawing tools will display it in the drawing layer. 
      map.entities.remove(polygon); 

      //Pass the polygon to the drawing tools to be edited. 
      tools.edit(polygon); 
     }); 

     //When the user presses 'esc', take the polygon out of edit mode and re-add to base map. 
     document.getElementById('myMap').onkeypress = function (e) { 
      if (e.charCode === 27) { 
       tools.finish(function (s) { 
        map.entities.push(s); 
       }); 
      } 
     }; 
    } 
    </script> 
</head> 
<body> 
    <div id="myMap" style="position:relative;width:600px;height:400px;"></div> 
</body> 
</html>

出典

2016-09-21 20:25:56 rbrundritt

bingマップのポリゴンにclickイベントを追加したい

答えて

関連する問題