地图和图层

    地图(Map)是由图层(Layer)组成的,每个图层代表一些来自要素源的数据。GIS的数据可以分为两大类:向量数据(Vector Data)和栅格数据(Raster Data)。所以,一般来说图层也分为两大类:向量图层(Vector Layer)和栅格图层(Raster Layer)。MapGuide稍有不同,将图层分为下列三类:

  • 向量图层(Vector Layer):用于显示和管理向量数据。
  • 栅格图层(Raster Layer):用户显示和管理图像和数字高程数据。
  • 制图图层(Drawing Layer):用户显示和管理DWF数据。

1. 地图概述
    一张地图可以由一个或多个图层组成,每张地图是由地图定义(Map Definition)来定义的,它包含了创建一个地图所需的信息。例如:

  • 地图所使用的地理坐标系。
  • 地图的初始范围(Extent)。
  • 指向图层定义(Layer Definition)的引用,这些图层组成了地图。
  • ……

    MapGuide中使用类MgMap代表一张地图。当创建一个MgMap对象时,它使用地图定义中的数据初始化地图。当用户和地图进行交互的时候,地图可能会发生变化,但是地图定义不会发生变化。
    地图定义不能存储在全局资源库中,只能存储在会话资源库中。所以,地图只能被相同会话(Session)中的网页所使用。
地图是由Viewer负责来创建的。当Viewer第一次被加载的时候,它会在会话资源库中创建一张地图。地图的名称来源于地图定义的名称。例如:如果一个Web布局引用了名为Sheboygan.MapDefinition的地图定义,那么Viewer就会创建一个名为Sheboygan.Map的地图。
    如果你的应用程序没有使用Viewer,那么你可以自己创建一张地图,并将其保存在会话资源库中。其基本步骤如下:

  • 创建一个MgMap对象。
  • 从一个地图定义中初始化MgMap对象。
  • 给MgMap对象命名。
  • 将地图保存在会话资源库中。

    例如,下面的代码会基于Sheboygan.MapDefinition创建一个名为Sheboygan.Map的地图。

     $mapDefId = new MgResourceIdentifier(
    "Library://Samples/Sheboygan/Maps/Sheboygan.MapDefinition");
    $map = new MgMap();
    $mapName = $mapDefId->GetName();
    $map->Create($resourceService, $mapDefId, $mapName);
    $mapId = new MgResourceIdentifier(
    "Session:$sessionId//$mapName." . MgResourceType::Map);
    $map->Save($resourceService, $mapId);

Map Definition

1.1 比例尺(Scale)
    地图比例尺是一个比值,它没有单位,比例尺越大,地图精度越高;比例尺越小,地图精度越小,但概括性越强。当图幅大小相同时,比例尺越大,包括的地面范围越小;比例尺越小,包括的地面范围越大。在同一区域或同类的地图上,内容要素表示的详略程度和图形符号的大小,主要取决于地图比例尺。
    当时用Viewer来浏览地图的时候,Viewer总是在某一比例尺下显示地图的。当在Viewer中缩放地图的时候,比例尺会随着发生变化。我们将Viewer中当前显示地图所用的比例尺称为视图比例尺(View Scale)。
1.2 绘图顺序(Draw Order)
    地图中的所有图层按照绘图顺序,从底部向顶部来绘制的。在绘图顺序底端的图层最先被绘制,所以在绘图顺序顶端的图层最后被绘制。所以,在绘图顺序顶端的图层会显示在底端图层的上方。

Draw Order

1.3 图层和图层组(Layer Group)
    一张地图可以由一个或多个图层组成。方法MgMap::GetLayers()会返回一个MgLayerCollection对象,这个对象包含了地图中的所有图层。它是按照图层的绘图顺序从顶部到底部来排序的,顶层的图层在图层列表的开端。  

    MgLayerCollection::GetItem()方法通过图层名称或在MgLayerCollection中的索引编号返回一个单独的MgLayer对象。假设layers是一个MgLayerCollection对象,那么Layers->GetItem(0)回返回最顶层的图层。
    图层可以集结成图层组,在同一组中的图层在地图图例中显示在一起。一张地图可以包含多个图层组,一个图层只能同时属于一个图层组。图层组可以嵌套,这意味着一个图层组可以包含另外一个图层组。在一张地图中,图层组的名称必须是唯一的,即使是嵌套的图层也是如此。方法MgMap::GetLayerGroups()返回一个MgLayerGroupCollection对象,这个对象返回了地图中的所有图层组。
1.4 基础地图(Base Map)和基础地图图层组(Base Map Layer Group)
    AJAX Viewer使用基础地图和基础图层组来优化图像渲染的性能。基础图层组中的所有图层会在一起渲染,形成一张独立的图像发送到Viewer。图像被分割成多个块(Tile),这样,只有所需的块被渲染和发送,而不是整个图像。块被缓冲在服务器,如果一个块已经存在于缓冲中,那么在发送前就无需渲染了。
    每个基础图层组预定义了一系列比例尺。当发送请求来查看某个比例尺的地图时,AJAX Viewer会在预定义的、最接近请求的地图视图比例尺下渲染块。
    基础图层组的所有图层是在一起渲染。所以,基础图层组中单个图层的可见性设置会被忽略,实际使用的是基础图层组的可见性设置。通常,基础图层上层的图层是带有透明背景的向量图层,这样使图像较小、相对较快地加载进Viewer。
你可以有多个基础图层组。除非高层的图层有透明区域或不可见,底层的图层会被高层的图层所覆盖。
1.5 地图图例(Map Legend)
    地图图例是用来解释地图地图中所使用到文字、符号、颜色等样式信息的一个表格。例如,下面的地图图例显示地图Fairfax Project包含了三个图层Roads、Title和Map Base,地图Title包含了五条样式规则。

Legend

2. 图层概述
    图层是由图层定义(Map Definition)来定义的,图层定义包含了创建一个图层所需的信息。例如:

  • 图层的要素源(Feature Source)。
  • 图层的样式(Style)。
  •  ……

    图层定义可以存储在全局资源库或会话资源库中。存储在会话资源库中的图层定义只能在相同的会话中被使用,当用户用户注销退出的时候这个图层定义也就消失了。如果想让这个图层被永久地存储,就需要将其存储在会话资源库中。
MapGuide中使用类MgLayer代表一个图层。每个图层都有一些属性,这些属性会决定图层在地图和地图图例如何显示。部分属性如下所示:

  • 图层名称(Vector Layer):一个为唯一的标识符。
  • 图例标签(Legend Label):显示在地图图例中的图层标签。
  • 可视控制(Visibility):决定图层是否在地图内显示。
  • 可选控制(Selectable):决定图层中的要素是否可以选择。

2.1 图层样式(Layer Style)
    图层样式用来指定使用什么样的样式(Style)来渲染图层中的数据,图层样式决定了一个图层的外观。图层样式存储在图层定义(Layer Definition)中,改变图层定义中的样式信息,就可以改变一个图层的外观。
    图层定义可以使用MapGuide Studio进行修改,也可以由Web Extensions API动态地创建和修改。
2.2 比例尺范围(Scale Range)
    向量图层和栅格图层都支持比例尺范围(Scale Range)的概念。一个比例尺范围用来指定在某个比例尺范围内使用什么样的样式显示要素。一个向量图层或栅格图层可以拥有多个比例尺范围,在每个比例尺范围内可以为图层定义不同的样式。例如:我们可以为一个多边形数据的向量图层定义如下的比例尺范围和样式。

比例尺范围

样式

0 – 10,000

用红色填充多边形

10,000 – 500,000

用黄色填充多边形

500,000 – infinity

用蓝色填充多边形

    假设当前地图的比例尺为9900,MapGuide使用红色填充这个向量图层中的多边形数据。当缩放地图比例尺到大于等于10,000、小于500,000的值时,MapGuide会刷新地图使用黄色填充这个向量图层中的多边形数据。
2.3 图层的可见性
    在一个给定的地图中,一个图层是否可见取决于以下三个因素:

  • 图层的可见性设置。
  • 包含图层的的图层组的可见性设置。
    • 如果设置组的可见性为不可见,那么组内所有图层的可见性全部变为不可见。即使某个图层可见性为可见,如果其所在组的可见性为不可见,这个图层仍然不可见。
    • 如果设置组的可见性为可见,那么组内每个图层的可见性是由它自己的可见性设置所决定。
  • 地图当前的视图比例尺和图层定义中设置的比例尺范围。

    为了让一个图层可见,不仅图层和包含图层的图层组的可见性都必须设置为可见,而且图层定义中必须包含一个在地图当前的视图比例尺范围内的样式。
    假设有图层“道路”是图层组“交通运输”的子图层,它的图层定义中包含两个比例尺范围0~10000和10000~24000。下面的表格显示了在不同的图层可见性、不同的图层组可见性、不同的视图比例尺设置下,图层实际的可见性。

图层的可见性

图层组的可见性

视图比列尺

实际的可见性

可见

可见

10000

可见

可见

可见

25000

不可见

可见

不可见

10000

不可见

不可见

可见

10000

不可见

3. 图层定义(Layer Definition)
    图层定义是一个XML文件,存储在资源库中,包含了一个图层的要素源(Feature Source)和样式(Style)信息。
    图层定义的XML Schema是由文件LayerDefinition-version.xsd定义的。打开文件LayerDefinition-version.xsd,图层定义的XML Schema如下。

Layer Definition

    由于向量图层、栅格图层和制图图层有不同的样式化要求,所以它们的图层定义也不尽相同。但是,它们都具有如下的元素。

  • ResourceId:要素源的资源ID,用来指定图层数据来自于那个要素源。
  • Opacity:这是一个0~1之间的值,用来表示图层的不透明度。0代表不透明,1代表完全透明。
  • ExtendData1:用于存储扩展数据。如果现有的图层定义现有的schema无法满足你的要求,你想新增一些与你的应用程序相关的信息到图层定义中,ExtendData1提供了一个非常好的解决方案。图层定义中的每个元素都包含一个ExtendData1子元素,你可以存储任何信息在ExtendData1中。MapGuide总是忽略元素ExtendData1中内容,留给你的应用程序读取和解释这些内容。

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
要在 Vue 中切换高德地图图层,可以通过以下步骤实现: 1. 在 Vue 的 `mounted` 钩子函数中初始化地图: ```javascript mounted() { // 初始化地图 this.map = new AMap.Map('map-container', { zoom: 10, center: [116.397428, 39.90923] }); } ``` 2. 在模板中添加地图容器元素: ```html <template> <div id="map-container" style="height: 500px;"></div> </template> ``` 3. 添加一个切换图层的按钮,绑定点击事件: ```html <template> <div> <div id="map-container" style="height: 500px;"></div> <button @click="switchLayer">切换图层</button> </div> </template> ``` 4. 在 Vue 实例中添加 `switchLayer` 方法,用于切换图层: ```javascript methods: { switchLayer() { // 获取当前地图图层 const currentLayer = this.map.getLayers()[0]; // 切换到卫星图层 if (currentLayer === this.satelliteLayer) { this.map.setLayers([this.roadNetLayer]); } else { // 切换到路网图层 this.map.setLayers([this.satelliteLayer]); } } } ``` 5. 在 `mounted` 钩子函数中初始化卫星图层和路网图层,并将路网图层设置为默认图层: ```javascript mounted() { // 初始化地图 this.map = new AMap.Map('map-container', { zoom: 10, center: [116.397428, 39.90923] }); // 初始化卫星图层 this.satelliteLayer = new AMap.TileLayer.Satellite(); // 初始化路网图层 this.roadNetLayer = new AMap.TileLayer({ tileSize: 256, zooms: [3, 18], getTileUrl: (x, y, z) => { return `https://webst01.is.autonavi.com/appmaptile?style=7&x=${x}&y=${y}&z=${z}`; } }); // 将路网图层设置为默认图层 this.map.setLayers([this.roadNetLayer]); } ``` 这样就可以在 Vue 中实现切换高德地图图层了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值