我需要帮助,我尝试更改我的折线颜色,但它不起作用,我不知道我的绘制线解决方案是否正确,请帮助我 =) 我将发布 2 个我的正常代码和一个代码尝试. 谢谢 =)
//This is My complete code
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% }
</style>
<script type="text/javascript"
src="https://maps.google.com/maps/api/js?sensor=true">
</script>
<script type="text/javascript">
var infowindow, map, path = [], service = new google.maps.DirectionsService(), poly;
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
function initialize()
{
directionsDisplay = new google.maps.DirectionsRenderer();
directionsDisplay.setPanel(document.getElementById("directionsPanel"));
var latlng = new google.maps.LatLng(41.850033, -87.6500523);
var myOptions =
{
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControlOptions: {
mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID]
},
disableDoubleClickZoom: true, //Desabilitar atalho do zoom por clique
draggableCursor: "crosshair" //Cursor do Mouse em +
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
directionsDisplay.setMap(map);
// FAZ A ROTA
google.maps.event.addListener(map, "click", function(evt) {
if (path.length == 0) {
path.push(evt.latLng);
poly = new google.maps.Polyline ({ map: map});
poly.setPath(path);
} else {
service.route({
origin: path[path.length - 1],
destination: evt.latLng,
travelMode: google.maps.DirectionsTravelMode.DRIVING //Pode ser Walking, Driving ou Bicycling
}, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
path = path.concat(result.routes[0].overview_path);
poly.setPath(path);
}
});
}
});
//Marcador
/*var marker = new google.maps.Marker({ position: latlng, title:"Hello World!"});
marker.setMap(map);
setMap()*/
var image = 'http://i47.tinypic.com/11wg1o0.png'
var marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(41.810033, -87.8500523),
icon : image,
draggable: true
});
var marker2 = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(41.850033, -87.6500523),
draggable: true
});
var pointA = marker;
var pointB = marker2;
//var jsonObj = Maps.newDirectionFinder().setOrigin(pointA).setDestination(pointB).getDirections();
// InfoBox
var content = '<iframe width="560" height="315" src="http://www.youtube.com/embed/v2ORAUREQUo" frameborder="0" allowfullscreen></iframe> ';
infowindow = new google.maps.InfoWindow({
content: content
});
google.maps.event.addListener(marker, 'click', function()
{
infowindow.open(map, this);
});
// rotas de bike
var bikeLayer = new google.maps.BicyclingLayer();
bikeLayer.setMap(map);
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>
这是死记硬背的部分
google.maps.event.addListener(map, "click", function(evt) {
if (path.length == 0) {
path.push(evt.latLng);
poly = new google.maps.Polyline ({ map: map});
poly.setPath(path);
} else {
service.route({
origin: path[path.length - 1],
destination: evt.latLng,
travelMode: google.maps.DirectionsTravelMode.DRIVING //Pode ser Walking, Driving ou Bicycling
}, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
path = path.concat(result.routes[0].overview_path);
poly.setPath(path);
}
});
}
});
最后,这就是我尝试放置颜色
var polylineOptions = {
strokeColor:"#FF0000",
strokeOpacity: 1,
strokeWeight: 2,
zIndex: 5
}
google.maps.event.addListener(map, "click", function(evt) {
if (path.length == 0) {
path.push(evt.latLng);
poly = new google.maps.Polyline (polylineOptions)({map: map});
poly.setPath(path);
} else {
service.route({
origin: path[path.length - 1],
destination: evt.latLng,
travelMode: google.maps.DirectionsTravelMode.DRIVING //Pode ser Walking, Driving ou Bicycling
}, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
path = path.concat(result.routes[0].overview_path);
poly.setPath(path);
}
});
}
});
什么错误?