`
wxb880114
  • 浏览: 678737 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

Openlayers学习笔记——Vector Layer Style

阅读更多
   我们了解到Vector layer能够完成很多工作,这节将更深入的探讨在矢量图层上怎样定制要素的外观,定制矢量要素的外观工作与control的外观定制非常相似,但是在矢量要素外观的定制上采用Style和StyleMap对象来代替CSS,由于矢量图层不使用栅格图像,我们可以用这种方式定制矢量图层。指定SVG(或者VML或Canvas)元素的样式。
    我们很容易通过修改默认样式文件来改变要素的样式,但是在矢量图层的要素,需要引用Rule类和Filter类,通过他们指定要素的样式。我们能做的不仅仅是改变颜色。我们可以改变大小,透明线风格,和各种各样的其他特性。
    采用样式有三种方式:
    %使用Style和StyleMap对象;
    %直接在图层上引用symbolizer;
    %直接对要素才有symbolizer(但是只能在从数据源中读取数据是出现);
    StyleMap本质上是一种Style对象映射到要素的各种不同状态或者意图,比如说,要素对象通常设置为默认意图,当你select某一要素时,它获得select意图,当然它的样式也对应着select意图的样式。
     Style对象包含样式符号库或者说是很多风格属性和值。我们利用符号库去定义样式,可以将符号库应用于Style对象、图层对象、甚至单个要素。

    2. symbolizer符号库
    symbolizer是个由健值对组成的匿名对象,这些健值对都是来描述样式属性的,与CSS很相似。例如 { fillColor: '#336699', strokeWidth: 4 }就是个符号库,它说明要素的颜色是#336699,笔画宽度是4个像素。
    当创建Style对象来指定某些要素的样式属性时我们使用symbolizer,我们直接在矢量图层上使用符号库,也可以在数据源文件中读取样式信息。
分享到:
评论

相关推荐

    openlayers图层控制加入group layer功能

    开发时,有时候图层很多,需要有同时打开关闭多个图层的功能,但是正式版的layerSwitcher不支持group layer功能. 从网上搜到layerSwitcher的扩展,是在源代码里添加对grouplayer的操作和事件支持. 对layerSwitcher....

    openlayers 风场渲染效果

    openlayers 风场渲染效果,放置风场数据即可使用

    openlayers6学习笔记

    openlayers6学习笔记,节省你的学习成本

    openlayers离线文档

    这份离线文档包含了OpenLayers的核心API详解,以及部分中文说明,对于学习和使用OpenLayers进行地图开发来说,是非常宝贵的资源。 首先,OpenLayers的基础概念是至关重要的。其中,"图层"(Layer)是地图的核心元素...

    openlayers遮罩示例

    **OpenLayers 遮罩示例** OpenLayers 是一个强大的开源JavaScript库,用于在Web上构建交互式的地图应用。这个示例将展示如何在...通过深入学习和实践,你可以利用OpenLayers创建出满足各种业务需求的地图应用。

    openlayers很多特效demo

    OpenLayers 是一个强大的开源JavaScript库,用于在网页上...通过研究这些OpenLayers特效demo,开发者不仅可以掌握基础的地图操作,还能学习到高级的交互和视觉效果的实现,为创建复杂且吸引人的地图应用提供强大支持。

    地图个人开发笔记和Demo

    —— 1.2 openlayers 实例化地图 —— 1.3 openlayers地图OSM形式 —— 1.4 openlayers地图XYZ形式 —— 1.5 国家地理信息公共服务平台 天地图 —— 1.6 天地图.四川 —— 1.7 天地图.西藏 —— 1.8 高德地图 —— ...

    openlayers_echarts开发实例

    - 在线示例:通过查看公开的GitHub项目(如“openlayers_echart”),学习实际的代码实现。 以上内容涵盖了OpenLayers和ECharts集成的基本概念、关键点以及实际应用场景。在实践中,开发者需要根据具体需求灵活...

    openlayers3.0学习笔记

    openlayers3.0学习笔记,节省你的学习成本

    openLayers的缩放级别

    OpenLayers 的缩放级别是指在不同比例尺或解析度下显示每个 layer 对象的引用, 即 ZoomLevels。OpenLayers 允许每个 layer 自定义自己的缩放级别,使之看起来合适。可以通过在构造函数中设置 options 属性来配置 ...

    openlayers的鼠标滚轮事件

    通过本篇文章的学习,我们了解了如何在OpenLayers中控制鼠标滚轮事件,包括启用和禁用滚轮缩放功能的方法。这对于提高Web地图应用的用户体验至关重要。希望读者能够根据自己的项目需求灵活运用这些技术点。

    openlayers中文文档

    OpenLayers还支持自定义样式,通过使用Style和Style Function,你可以改变图层、标记甚至单个几何对象的外观。同时,OpenLayers与GeoJSON格式兼容,使得导入和导出地理数据变得简单。 总的来说,"openlayers中文...

    基于openlayer的军事动态标绘.7z

    1. 矢量图层:OpenLayer中的Vector Layer允许开发者动态创建、编辑和删除地图上的几何对象,如点、线、面等,非常适合表示军事目标和动态变化的信息。 2. 数据源:动态标绘的数据通常来自服务器或本地存储,Open...

    openlayers加载静态图片地图

    OpenLayers 是一个强大的开源JavaScript库,用于在Web浏览器中创建交互式地图应用。它支持多种数据源,包括WMS、WMTS、GeoJSON等,同时也允许开发者加载静态图片作为地图底图。本教程将详细介绍如何使用OpenLayers...

    openlayers3官方教程离线版

    3. **图层管理**:OpenLayers 3支持多种图层类型,如瓦片图层(`ol.layer.Tile`)、图像图层(`ol.layer.Image`)和矢量图层(`ol.layer.Vector`)。每种图层都有其特定的用途,例如瓦片图层常用于加载服务端生成的...

    openlayers中文.rar

    这个"openlayers中文.rar"压缩包提供了一份中文手册,对于想要学习和掌握OpenLayers的开发者来说,是一份非常实用的学习资源。 1. **OpenLayers基本概念**: - **地图层(Layers)**:OpenLayers中的地图由多个...

    OpenLayers带内部箭头的折线绘制

    做 gis 项目的朋友应该对 OpenLayer 都很熟悉了, OpenLayer 是一款可以做离线地图的开源 gis 库,能让我们方便的基于离线瓦片做离线地图; 虽然有很多优点,但是其并没有像 百度、搞的一样提供内部带箭头线条的绘制...

    openlayers右键菜单

    你可以通过查看和学习这个示例,进一步理解和应用OpenLayers的右键菜单功能。 总结来说,OpenLayers右键菜单是通过自定义事件监听、HTML/CSS布局和JavaScript事件处理来实现的。这个“不错的demo”为我们提供了一个...

    openlayers加载WMS服务

    OpenLayers 是一个流行的开源JavaScript库,用于在网页上创建交互式的地图应用。WMS(Web Map Service)是一种标准的OGC(Open Geospatial Consortium)协议,它允许客户端请求地图图像,而服务器则根据请求参数生成...

    openlayers 中文文档

    OpenLayers中文学习文档,原始文档是.md格式的转换成Html后转换成了chm格式,感谢原文作者。

Global site tag (gtag.js) - Google Analytics