首页 > 其他分享 ># openlayers 打标记点

# openlayers 打标记点

时间:2022-08-24 15:24:53浏览次数:42  
标签:layer let 标记 feature source openlayers new

openlayers 打标记点

这个效果其实和高德地图百度地图差不多了,就是说,有一个经纬度,我想在这个点的位置打一个标记。

在这里插入图片描述
那个蓝点就是我们的地点标识。

下面说一下效果实现的代码,很简单,不用说,直接上代码。

	addTag() {
        let feature = new Feature({
          id: "ddss",
          geometry: new Point(fromLonLat([116.403218, 39.92372]))
        });
        feature.setStyle(
          new Style({
            image: new Icon({
              anchor: [0.5, 1], //锚点
              opacity: 1,
              scale: 1,
              src: require("./dw.png") //图标的URL
            })
          })
        );
        let source = new VectorSource()
        source.addFeature(feature)
        let layer = new VectorLayer({
          opacity: 1
        })
        layer.setSource(source)
        map.addLayer(layer)
      },

没了,就这些。简单吧!

标签:layer,let,标记,feature,source,openlayers,new
From: https://www.cnblogs.com/wjw1014/p/16620051.html

相关文章

  • 开源的跨平台音乐标记器
     MusicBrainzPicard是一款免费的开源软件,这款软件拥有精简的用户界面,能够执行各类音频标记操作。Picard是一种高效的工具,值得从头开始设计音频标记器和音轨标识符,以帮助......
  • 前端html页面基础,元素,超文本标记语言
    前端什么是前端前端核心超文本传输协议前戏HTTP超文本传输协议什么是超文本传输协议HTTP传输协议四大特性数据格式响应状态码html简介head内常见的标签......
  • Pytest框架 — 14、Pytest的标记(五)(控制测试用例执行顺序)
    目录1、前言2、使用3、标记最先执行和最后执行1、前言在执行自动化测试时,我们通常都希望能够控制执行测试用例的顺序。在unittest框架中默认按照ACSII码的顺序加载测试......
  • Pytest框架 — 13、Pytest的标记(四)(分组执行)
    目录1、前言2、mark的使用(一)注册自定义标记(二)在测试用例上标记(三)执行3、扩展(一)在同一个测试用例上使用多个标记(二)在测试类上使用标记1、前言在自动化测试工作中我们有时......
  • Pytest框架 — 12、Pytest的标记(三)(重复执行)
    目录1、前言2、--count参数使用(一)在命令行或者main函数使用(二)在全局配置文件中使用3、--repeat-scope参数使用4、@pytest.mark.repeat(count)装饰器使用5、结合参数x使重复......
  • KASP标记与农作物育种
    目录KASP的特点KASP的原理与步骤原理步骤(1)引物和探针设计(2)普通PCR扩增(3)荧光检测和分析KASP与农业育种KASP的特点在过去30年中,分子标记从低通量限制性片段长度多态性(RFLP......
  • 线段树模板【带懒标记】
    #include<bits/stdc++.h>usingnamespacestd;typedeflonglongll;constintN=1e5+10;inta[N];structnode{  intl,r;  lladd,sum;  node(){  ......
  • 解决 openlayers 加载高德地图拉伸
    在使用openlayers加载高德地图瓦片时,会出现图片、标注等有一定的形变、拉伸等。为什么会出现这样的问题?原先代码exportdefault{components:{MapTool},data......
  • 一文带你弄懂 JVM 三色标记算法!
    大家好,我是树哥。最近和一个朋友聊天,他问了我JVM的三色标记算法。我脑袋一愣发现竟然完全不知道!于是我带着疑问去网上看了几天的资料,终于搞清楚啥事三色标记算法,它是用......
  • 从Git上新拉下来的C#工程,其引用库全部被标记为黄色感叹号解决方法
    解决操作如下:①工具——NuGet包管理器——管理解决方案的NuGet程序包。 ②对缺少的NuGet程序包进行还原。  ③还原完成(解决方案资源管理器中点击刷新),工程恢复正......