Question

我想在Google地图上将部分街道颜色更改为红色或蓝色，例如谷歌地图导航？可能吗？我使用ASP.net和JavaScript。我添加了我的地图：

var myLatlng = new google.maps.LatLng(36.9, 30.6);
var myOptions = {
    zoom: 10,
    center: myLatlng,
    disableDefaultUI: true,
    panControl: true,
    zoomControl: true,
    zoomControlOptions: {
        style: google.maps.ZoomControlStyle.DEFAULT
    },
    mapTypeControl: true,
    mapTypeControlOptions: {
        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
    },
    streetViewControl: true,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map'), myOptions);

Answer 1

使用路线服务突出显示两条路线的示例，一条红色（＃FF0000）和一条蓝色（＃0000FF）。您需要适当选择路线的原点和目的地参数，如果所选路线不符合您想要的路线，则可能需要添加路标。

＆＃13;

function initialize() {
  var myLatlng = new google.maps.LatLng(36.9, 30.6);
  var myOptions = {
    zoom: 10,
    center: myLatlng,
    disableDefaultUI: true,
    panControl: true,
    zoomControl: true,
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.DEFAULT
    },
    mapTypeControl: true,
    mapTypeControlOptions: {
      style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
    },
    streetViewControl: true,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById('map'), myOptions);
  var directionsService1 = new google.maps.DirectionsService();
  var directionsDisplay1 = new google.maps.DirectionsRenderer({
    map: map,
    polylineOptions: {
      strokeColor: "#FF0000"
    },
    preserveViewport: true,
    suppressMarkers: true
  });
  directionsService1.route({
    origin: new google.maps.LatLng(36.95206, 30.636348),
    destination: new google.maps.LatLng(36.9058, 30.682199),
    travelMode: google.maps.TravelMode.DRIVING
  }, function(response, status) {
    if (status === google.maps.DirectionsStatus.OK) {
      directionsDisplay1.setDirections(response);
    } else {
      window.alert('Directions request failed due to ' + status);
    }
  });
  var directionsService2 = new google.maps.DirectionsService();
  var directionsDisplay2 = new google.maps.DirectionsRenderer({
    map: map,
    polylineOptions: {
      strokeColor: "#0000FF"
    },
    preserveViewport: true,
    suppressMarkers: true
  });
  directionsService2.route({
    origin: new google.maps.LatLng(36.899706, 30.763309),
    destination: new google.maps.LatLng(36.94513, 30.831226),
    travelMode: google.maps.TravelMode.DRIVING
  }, function(response, status) {
    if (status === google.maps.DirectionsStatus.OK) {
      directionsDisplay2.setDirections(response);
    } else {
      window.alert('Directions request failed due to ' + status);
    }
  });

}
google.maps.event.addDomListener(window, "load", initialize);

＆＃13;

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

＆＃13;

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>

＆＃13;

是否可以将某些Google Map街道颜色自定义为红色或蓝色？

1 个答案: