谷歌地图上不同路线的不同颜色导入谷歌引擎中构建的多个KML文件?

时间:2014-03-23 00:32:49

标签: javascript google-maps kml

我正在将多个KML图层文件加载到谷歌地图中。然而,它变得难以阅读,因为它们是地图上不同的巴士路线。有可能让它们以不同的颜色,例如kml1文件为红色,kml2文件为蓝色等。我使用谷歌引擎来构建这些KML文件但是我没有选择在线上使用不同的颜色/标记。

function initialize() {
  var abby = new google.maps.LatLng(49.051078,-122.314221);
  var mapOptions = {
    zoom: 11,
    center: abby
  }

  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  var ctaLayer = new google.maps.KmlLayer({
    url:'https://dl.dropboxusercontent.com/u/143598220/1.%20Blueridge-McKee%20GoLine.kml'
  });

  var ctaLayer2 = new google.maps.KmlLayer({
    url:'https://dl.dropboxusercontent.com/u/143598220/2.%20Bluejay-Huntingdon%20GoLine.kml'
  });

var ctaLayer3 = new google.maps.KmlLayer({
    url:'https://dl.dropboxusercontent.com/u/143598220/3.%20Clearbrook%20-%20UFV%20GoLine.kml'
  });

  ctaLayer.setMap(map);
  ctaLayer2.setMap(map);
  ctaLayer3.setMap(map);

  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude,
                                       position.coords.longitude);

      var infowindow = new google.maps.InfoWindow({
        map: map,
        position: pos,
        disableAutoPan: true
      });



  marker=new google.maps.Marker({
  position:pos,
  animation:google.maps.Animation.BOUNCE,
        disableAutoPan: true

  });


marker.setMap(map);

var infowindow2 = new google.maps.InfoWindow({
  content:"Your Current Location!"
  });

google.maps.event.addListener(marker, 'click', function() {
  infowindow2.open(map,marker);
  });

   //   map.setCenter(pos);

    }, function() {
      handleNoGeolocation(true);
    });
  } else {
    // Browser doesn't support Geolocation
    handleNoGeolocation(false);
  }
}

function handleNoGeolocation(errorFlag) {
  if (errorFlag) {
    var content = 'Error: The Geolocation service failed.';
  } else {
    var content = 'Error: Your browser doesn\'t support geolocation.';
  }

  var options = {
    map: map,
    position: new google.maps.LatLng(60, 105),
    content: content
  };



  var infowindow = new google.maps.InfoWindow(options);
  map.setCenter(options.position);


}



google.maps.event.addDomListener(window, 'load', initialize);

0 个答案:

没有答案