单击 bingmap 的航点

Question

我有一个带有 bingmap 的地图，我实现了 waypoints。我希望当我点击一个航点时它会显示一个信息 window。

if (!$scope.directionsManager) { _createDirectionsManager(); }
    if($scope.directionsManager.getAllWaypoints().length < 2)
    {
      $scope.directionsManager.resetDirections();
      $scope.waypoints.forEach(function (waypoint) {
        var order_waypoint = new Microsoft.Maps.Directions.Waypoint({ location: new Microsoft.Maps.Location(waypoint.lat, waypoint.lng) });
        console.log("order_waypoint", order_waypoint)
        $scope.directionsManager.addWaypoint(order_waypoint);
      })
    }
    var renderOption = {
        itineraryContainer: document.getElementById('directionsItinerary'),

        waypointPushpinOptions:{
            // icon: "http://vignette3.wikia.nocookie.net/freeciv/images/1/1c/Crystal_128_penguin.png/revision/latest?cb=20071106133132&path-prefix=es",
            // hoverIcon: "http://vignette3.wikia.nocookie.net/freeciv/images/1/1c/Crystal_128_penguin.png/revision/latest?cb=20071106133132&path-prefix=es",
            // height: 10,
            // width: 10,
            draggable: false,
            textOffset: new Microsoft.Maps.Point(-1, 3)
        }
    }
    $scope.directionsManager.setRenderOptions(renderOption);
    $scope.directionsManager.calculateDirections();

谢谢！

Answer 1

我没有使用 Bing 地图 API，但是 the docs on the Waypoint class make it look like you might need a custom pushpin in order to intercept its click event。

var location = new Microsoft.Maps.Location(waypoint.lat, waypoint.lng);
var pushpin = new Microsoft.Maps.Pushpin(location);
Microsoft.Maps.Events.addHandler(pushpin, 'click', function() {
    // Implementation can go here
});

var order_waypoint = new Microsoft.Maps.Directions.Waypoint(
    {location: location, pushpin: pushpin});
$scope.directionsManager.addWaypoint(order_waypoint);

您可以在 order_waypoint 上获得对默认值 pushpin 的引用，而无需创建您自己的自定义引用，并使用 addHandler 将点击事件绑定到它。我没有运行代码来测试它，而且 I don't see a way to get a reference to the default pushpin, only the custom one。您可以尝试一下 (order_waypoint.getPushpin())，看看它是否有效。

单击 bingmap 的航点

Click on waypoint of bingmap

javascript

routes

bing-maps

directions