1

是否可以有一个由自定义图像马赛克组成的图层?

我只能通过OpenLayers.Layer.Image. 本质上,如果我能找到一种方法来为给定图层的图块指定自定义图像,那么我的问题就会得到解决。

我尝试了 , 和 的各种组合,但OpenLayers.Tile无法正常工作。OpenLayers.Tile.ImageOpenLayers.LayerOpenLayers.Layer.Grid

我遵循的基本流程是:

var map = new OpenLayers.Map('map');

var layer = new <OpenLayers.Layer | OpenLayers.Layer.Grid> (<parameters>);

var tile1 = new <OpenLayers.Tile | OpenLayers.Tile.Image> (<parameters>);

map.addLayer(layer);

map.zoomToMaxExtent();

下面提供了我如何初始化每个构造函数的具体示例。

关于OpenLayers.Layer.Grid,我实际上不确定为 url 和 params 构造函数参数指定什么。

任何关于这是否有效和/或我是否走在正确轨道上的建议将不胜感激。

OpenLayers.Layer

var layer = new OpenLayers.Layer(
  'layer_name',
  {
    isBaseLayer: true
  }
);

OpenLayers.Layer.Grid

var layer = new OpenLayers.Layer.Grid(
  'layer_name',
  ?url?,
  ?params?
);

OpenLayers.Tile

var layer = new OpenLayers.Tile(
  layer_name,
  new OpenLayers.Pixel(0,0),
  new OpenLayers.Bounds(-1,-1,1,1),
  'square1.jpg',
  new OpenLayers.Size(300,300)
);

OpenLayers.Tile.Image

var layer = new OpenLayers.Tile.Image(
  layer_name,
  new OpenLayers.Pixel(0,0),
  new OpenLayers.Bounds(-1,-1,1,1),
  new OpenLayers.Size(300,300),
  {
    url: 'square1.jpg'
  }
);
4

2 回答 2

1

您是否尝试过 Zoomify 图层?这是示例。它允许您在地图中加载来自给定目录的所有图像,以表单命名{z}-{x}-{y}.jpg,其中{z}是缩放级别。

于 2012-10-01T08:16:29.003 回答
0

如果您需要将图像分解成更小的图块,我建议使用这个免费的 MapTiler软件,它可以根据需要创建多个缩放级别的图块。

您可以使用 TMS 图层创建图像切片的地图图层:

var layer = new OpenLayers.Layer.TMS("TMS Layer","",
    {url: '', serviceVersion: '.', layername: '.', alpha: true,
     type: 'png', getURL: getTileURL 
    }
);
map.addLayer(layer);

TMS 层使用该getTileURL函数来查找要显示的平铺图像。此函数假定图像存储在类似于MapTiler创建的层次结构中。
例如:img/tiles/7/4/1.png 是缩放级别 7 左起第 5 个和底部第 2 个的图像。

function getTileURL(bounds) 
{
    var res = this.map.getResolution();
    var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));
    var y = Math.round((bounds.bottom - this.maxExtent.bottom) / (res * this.tileSize.h));
    var z = this.map.getZoom();

    var path = "img/tiles/" + z + "/" + x + "/" + y + "." + this.type;
    var url = this.url;
    if (url instanceof Array) 
    {
        url = this.selectUrl(path, url);
    }
    return url + path;
}
于 2012-09-20T16:05:24.303 回答