Openlayer系列:利用GeoServer和Openlayer地图显示区域掩模

7 篇文章 0 订阅
6 篇文章 0 订阅

前言

利用GeoServer和Openlayer地图显示区域掩模

利用GeoServer进行图层发布

Openlayer地图显示区域掩模

对界面地图进行切换,卫星图利用GeoServer,水系等根据geojson文件生成图层,效果如下

卫星图部分代码如下:

// 创建卫星图图层
        _that.satelliteLayer = new TileLayer({
          name: '海宁卫星区域',
          source: new TileWMS({
            url: 'http://gis.1.com/geoserver/test_hn/wms',
            params: {
              LAYERS: 'test_hn:haining_Level_14',
              TILED: true
            },
            serverType: 'geoserver'
          }),
          style: new Style({
            stroke: new Stroke({
              color: 'rgba(16, 66, 118, 0.6)', //'#1E71B8',
              width: 4
            }),
            fill: new Fill({
              color: 'rgba(255, 255, 255, 0.2)' // 'rgba(50, 103, 174, 0.1)' //'rgba(15, 62, 115, 0.1)'
            })
          })
        })
    //地图加载图层
    window.map = new Map({
            target: 'map',
            layers: [
              _that.satelliteLayer,
              _that.waterLayer,
              _that.riverLayer,
              _that.riverBoundaryLayer
            ],
            view: view,
            controls: defaultControls({
              //加载控件到地图容器中
              zoom: false,
              rotate: false,
              attribution: false
            })
          })

欢迎交流,知识星球、微信公众号与账号"浪潮行舟"同号

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

浪潮行舟

你的鼓励是我创作的最大动力。

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值