样式:Openlayers中的颜色和笔触宽度?

时间:2011-10-14 13:52:20

标签: javascript vector openlayers openstreetmap gml

我尝试了一些方法,但似乎无法找到合适的方式,
如何为此图层添加样式:

        var line_1 = new OpenLayers.Layer.Vector("Line nr 1", {
            projection: map.displayProjection,
            strategies: [new OpenLayers.Strategy.Fixed()],
            protocol: new OpenLayers.Protocol.HTTP({
                url: "lines/line_1.kml",
                format: newOpenLayers.Format.KML({
                    extractStyles: true,
                    extractAttributes: true
                })
            })
        });

就像下面的图层一样:

            var line_1 = new OpenLayers.Layer.GML('Line nr - 1', 
                    "lines/line_1.kml",
                    {
                            visibility: true,
                            format: OpenLayers.Format.KML,
                            style: {strokeWidth: 4, strokeColor: "#ff0000", strokeOpacity: 1 },
                            projection: map.displayProjection,
                            strategies: [new OpenLayers.Strategy.Fixed()]
                    }
            );

不同之处在于第一个变量Im使用 Vector 而第二个 GML 我仍然是这个东西的初学者,任何帮助都会非常感激。

1 个答案:

答案 0 :(得分:3)

您可以像这样定义样式:

var style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
style.fillOpacity = 0.2;
style.graphicOpacity = 1;
style.strokeWidth = 4; 
style.strokeColor = "#ff0000";
style.strokeOpacity = 1;

然后在创建Vector图层时将其传递给选项:

var line_1 = new OpenLayers.Layer.Vector("Line nr 1", {
            style : style,
            projection: map.displayProjection,
            strategies: [new OpenLayers.Strategy.Fixed()],
            protocol: new OpenLayers.Protocol.HTTP({
                url: "lines/line_1.kml",
                format: newOpenLayers.Format.KML({
                    extractStyles: true,
                    extractAttributes: true
                })
            })
        });