javascript 在 DirectionsRenderer 中更改折线的颜色
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9311498/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
change the color of the polyline in DirectionsRenderer
提问by Houcine
i've integrated a map and i want to display the route directions between two locations.
everything is working fine and the directions is displayed perfectly ,
but i want to change the color of the Polylinedirection ,i've tried this code like the documentation says :
我已经集成了一张地图，我想显示两个位置之间的路线方向。一切正常，方向显示完美，但我想更改Polyline方向的颜色，我已经尝试过像文档中所说的这样的代码：
//polyline options
var pOptions = {
map: map,
strokeColor: "#2249a3",
strokeOpacity: 0.9 ,
strokeWeight: 12,
z-index: 99
};
logJava(polylineOptions);
//directionsRenderer options
var mDirectionsRendererOptions = {
map: map,
suppressMarkers: true,
suppressInfoWindows: true,
polylineOptions: pOptions
};
logJava(mDirectionsRendererOptions);
directionsDisplay = new google.maps.DirectionsRenderer(mDirectionsRendererOptions);
but when i add this code , it stops the map , and it displays nothing, when i comment it , everything is working fine .
但是当我添加此代码时，它会停止地图，并且什么也不显示，当我对其进行评论时，一切正常。
what is wrong with this code, and how to change the color of the polyline with google maps javascript api v3?
这段代码有什么问题，以及如何使用google maps javascript api v3更改折线的颜色？
Thanks in advance,
提前致谢，
回答by david strachan
At global declarations
在全球声明
var polylineOptionsActual = new google.maps.Polyline({
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 10
});
At initialise
初始化时
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer({polylineOptions: polylineOptionsActual});
回答by Yara
In answer marked as resolved I see that object Polyline used for polylineOptions. In my case I use the next code
在标记为已解决的答案中，我看到用于 polylineOptions 的对象 Polyline。在我的情况下，我使用下一个代码
new google.maps.DirectionsRenderer({ suppressMarkers: true, polylineOptions: { strokeColor: '#5cb85c' } });
The difference is that I assign polylineOptions, not Polylineobject. Not sure it could be helpful, but decided to add these answer.
不同之处在于我分配了polylineOptions，而不是Polyline对象。不确定它会有所帮助，但决定添加这些答案。
回答by Kashif
Using setOptions(options:DirectionsRendererOptions)makes code more readable. The coding would be:
使用setOptions(options:DirectionsRendererOptions)使代码更具可读性。编码将是：
At global level:
在全球层面：
var directionsDisplay;
Inside initialize()method:
内部initialize()方法：
var polyline = new google.maps.Polyline({
strokeColor: '#C00',
strokeOpacity: 0.7,
strokeWeight: 5
});
directionsDisplay = new google.maps.DirectionsRenderer();
directionsDisplay.setOptions({polylineOptions: polyline});
now directionDisplay can be used in any method with the custom poly line.
回答by mkopriva
@Seacat, after you update the directionsRenderer with the new polylineOptions, you have to re-render the directions response which is stored inside the renderer object..
@Seacat，在使用新的 polylineOptions 更新方向渲染器后，您必须重新渲染存储在渲染器对象内的方向响应..
directionsRenderer.setDirections(directionsRenderer.directions);
