【问题标题】:style: color and strokewidth in Openlayers?样式:Openlayers 中的颜色和笔触宽度?
【发布时间】:2011-10-14 13:52:19
【问题描述】:

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

        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
我仍然是这方面的初学者,任何帮助将不胜感激。

【问题讨论】:

    标签: javascript vector openlayers openstreetmap gml


    【解决方案1】:

    你可以这样定义样式:

    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 layer的时候传入options中:

    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
                    })
                })
            });
    

    【讨论】:

      猜你喜欢
      • 2020-07-10
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-12-12
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多