简体   繁体   English

OpenLayers 2 - 将填充和不透明度设置为多边形样式

[英]OpenLayers 2 - Set fill and opacity to Polygon Style

My goal is to use for different shapes ( Triangle, Circle, Square, Hexagon etc. ) different fill colors and opacity values for each shape.我的目标是为不同的形状(三角形、圆形、方形、六边形等)使用不同的填充 colors 和每个形状的不透明度值。

With the below code I can draw the shapes, set different titles and stroke colors.使用下面的代码,我可以绘制形状、设置不同的标题和描边 colors。 But I'm not able to set the fill color and the opacity values.但我无法设置填充颜色和不透明度值。

I checked the documentation and its looks like I could achieve this with "fillColor" and "fillOpacity" but it doesn't works.我检查了文档,看起来我可以使用“fillColor”和“fillOpacity”来实现这一点,但它不起作用。

 function GetLonLatObj(lat, lon){ var lonLat = new OpenLayers.LonLat( lon,lat ).transform( new OpenLayers.Projection("EPSG:4326"), // Transformation aus dem Koordinatensystem WGS 1984 map.getProjectionObject() // in das Koordinatensystem 'Spherical Mercator Projection' ); return lonLat } var points = [] var fontColor = "blue"; var title = "Test"; var map = new OpenLayers.Map("mapdiv"); map.addLayer(new OpenLayers.Layer.OSM()); var zoom=16; latLonPoint = GetLonLatObj("46.76", "7.606944444444444"); latLonPoint2 = GetLonLatObj("46.735", "7.543055555555555"); latLonPoint3 = GetLonLatObj("46.7169444", "7.569166666666667"); latLonPoint4 = GetLonLatObj("46.76", "7.606944444444444"); latPoint = latLonPoint.lat lonPoint = latLonPoint.lon latPoint2 = latLonPoint2.lat lonPoint2 = latLonPoint2.lon latPoint3 = latLonPoint3.lat lonPoint3 = latLonPoint3.lon latPoint4 = latLonPoint4.lat lonPoint4 = latLonPoint4.lon //var point = new OpenLayers.Geometry.Point(828260.4259880, 5933577.75538379); point = new OpenLayers.Geometry.Point(lonPoint, latPoint); point2 = new OpenLayers.Geometry.Point(lonPoint2, latPoint2); point3 = new OpenLayers.Geometry.Point(lonPoint3, latPoint3); point4 = new OpenLayers.Geometry.Point(lonPoint4, latPoint4); points.push(point); points.push(point2); points.push(point3); points.push(point4); var selected_polygon_style = { strokeWidth: "3", strokeColor: fontColor, fontColor: "red", fontSize: "16px", fontWeight: "bold", fontColor: "black", label: title }; vectorLayer = new OpenLayers.Layer.Vector(); vectorLayer.style = selected_polygon_style; //map.addLayers([vector]); vectorLayer.addFeatures([new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(points))]); map.addLayers([vectorLayer]); var markers = new OpenLayers.Layer.Markers( "Markers" ); map.addLayer(markers); markers.addMarker(new OpenLayers.Marker(latLonPoint)); map.setCenter (latLonPoint, zoom);
 <script src="https://buhli.dyndns.org:444/openlayers.js"></script> <html> <body> <div id="mapdiv"></div> </body> </html>

Can someone help me here?有人可以在这里帮助我吗?

Thank you very much and best regards非常感谢和最好的问候

The problem was the LineString in the follow command.问题是以下命令中的 LineString。

vectorLayer.addFeatures([new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(points))]);

I could fix it with it as I replaced with LinearRing.当我用 LinearRing 替换时,我可以用它来修复它。

A LinearRing is a special LineString which is closed. LinearRing 是一个特殊的 LineString,它是封闭的。 A LineString can but must not be closed. LineString 可以但不能关闭。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM