用于 OpenLayer 的 JavaScript 配置文件

javascript config file for openlayers

本文关键字:配置文件 JavaScript OpenLayer 用于      更新时间:2023-09-26

我是OpenLayers的新手。我正在尝试找出为我正在创建的地图提供配置文件的最佳方法是什么。

例如,我正在创建具有以下样式的地图:

    var defaultStyle = new OpenLayers.Style(
                        {
                            pointRadius: 10,
                            fillColor: "yellow",
                            strokeColor:"#0500bd", 
                            strokeWidth:2,
                            fillOpacity:0.4,
                            labelXOffset: "${xOffset}",
                            labelYOffset: "${yOffset}",
                            labelAlign: "${align}"
                        });

我想将pointRadiusfillColor放在配置文件中,这样我就不必修改源代码,而只需修改配置文件。

我应该创建一个JS文件;配置.js内容如下:

      var config = {
           map:{
               style: {
                   pointRadius: 10,
                   fillColor: "yellow"
               },
           },
      };

然后,在我的其他创建样式的 JS 中,执行以下操作:

    var defaultStyle = new OpenLayers.Style(
    {
        pointRadius: config.map.style.pointRadius,
            fillColor: config.map.style.fillColor,
        strokeColor:"#0500bd", 
        strokeWidth:2,
        fillOpacity:0.4,
                    labelXOffset: "${xOffset}",
            labelYOffset: "${yOffset}",
        labelAlign: "${align}"
    });

推荐什么?

我不能说什么是"推荐"。但是,您的解决方案与我们当前项目的方式非常相似。一年多来,我们一直这样做,取得了很大的成功。我们将数据库中的配置保存为 JSON 数组,然后允许 JS 解析该数组。

然后,您还可以使用 OpenLayers.Util.extend 函数来扩展您的样式:

var config = {
       map:{
           style: {
               pointRadius: 10,
               fillColor: "yellow"
           },
       },
  };
var defaultStyle = new OpenLayers.Style(OpenLayers.Util.extend({
       strokeColor:"#0500bd", 
       strokeWidth:2,
       fillOpacity:0.4,
       labelXOffset: "${xOffset}",
       labelYOffset: "${yOffset}",
       labelAlign: "${align}"
},config.map.style));

我会做这样的事情:

var config = {
  default_map_style: {
    pointRadius: 10,
    fillColor: 'yellow'
  }
};

然后,我不会一一使用它,而是使用我想动态使用的其他属性扩展默认地图样式对象,如下所示:

var defaultStyle = new OpenLayers.Style(
  $.extend({}, config.default_map_style, {
    strokeColor: '#0500bd'
  }
);

我正在使用上面的jQuery.expand,但如果你不想使用jQuery,你可以在Underscore或Lo-dash中找到扩展的另一个实现。请注意,重要的是我们将一个新对象作为 extend 的第一个参数传递,因为我们不想更改default_map_style对象。