1 <!DOCTYPE html>

 2 <html lang="zh">

 3     <head>

 4         <meta charset="UTF-8">

 5         <meta name="viewport" content="width=device-width, initial-scale=1.0">

 6         <meta http-equiv="X-UA-Compatible" content="ie=edge">

 7         <link rel="stylesheet" type="text/css" href="leaflet/leaflet.css" />

 8         <title></title>

 9         <style type="text/css">

10             body {

11                 margin: 0;

12             }

13

14             #mapid {

15                 height: 500px;

16             }

17         </style>

18     </head>

19     <body>

20         <div id="mapid"></div>

21

22         <script type="text/javascript" src="leaflet/leaflet.js"></script>

23

24         <script type="text/javascript">

25             const mymapOptions = {

26                 // 地图中心

27                 center: [50.5, 30.5],

28                 // 地图的最小缩放级别

29                 minZoom: 11,

30                 // 初始化时的缩放等级

31                 zoom: 13,

32                 // 地图的最大缩放级别

33                 maxZoom: 15,

34                 // 强制让地图的缩放级别始终为这个值的倍数

35                 zoomSnap: 1,

36                 // 版权控件添加到地图中（即水印）

37                 attributionControl: false,

38                 // 是否显示zoom 缩放控件,默认是true

39                 zoomControl: true,

40             }

41

42             const mymap = L.map('mapid', mymapOptions);

43

44             const myIcon = L.icon({

45                 iconUrl: './leaflet/images/marker-icon.png.png',

46                 iconSize: [38, 95],

47                 // 图标 "tip" 的坐标（相对于其左上角）。

48                 //图标将被对齐，使该点位于标记的地理位置。如果指定了尺寸，默认为居中，也可以在CSS中设置负的边距。

49                 iconAnchor: [22, 94],

50                 // 弹出窗口（popup）的坐标，相对于图标锚点而言，将从该点打开

51                 popupAnchor: [-3, -76],

52

53             });

54

55             const markerOptions = {

56                 icon: myIcon,

57                 // 不生效，默认是没有tooltip 提示

58                 title: 'ddddd'

59             }

60

61             const mapMarker = L.marker(markerLatlng).addTo(mymap);

62             // const mapMarker = L.marker([50.5, 30.5]).addTo(mymap); 可以是数组的形式

63

64         </script>

65

66     </body>

67 </html>

5. icon创建的更多相关文章

  1. SuperMap iClient for JavaScript 新手入门

    地理信息系统(英语:Geographic Information System,缩写:GIS)是一门综合性学科,结合地理学与地图学,已经广泛的应用在不同的领域,是用于输入.存储.查询.分析和显示地理数 ...

  2. java第二次作业

    这次通过学习,我掌握了下拉菜单和单选按钮的使用下拉菜单构造方法:JComboBox() 创建具有默认数据模型的 JComboBox.JComboBox(ComboBoxModel aModel) 创建 ...

  3. php生成网页桌面快捷方式

    本文将介绍使用PHP生成网页桌面快捷方式的代码,并添加图标及解决不同浏览器保存出现的乱码问题. 我们访问网站时,如果网站的内容很有吸引,一般我们都会使用浏览器的收藏夹功能,收藏此网站. 在浏览器收藏的 ...

  4. Linux 下从头再走 GTK+-3.0 (三)

    之前我们为窗口添加了一个按钮,接下来让这个按钮丰富一点.并给窗口加上图标. 首先创建 example3,c 的源文件. #include <gtk/gtk.h> static void a ...

  5. shinydashboard包---为shiny提供BI框架

    1.安装 install.packages("shinydashboard") 2.基础知识 仪表盘有三个部分:标题.侧边栏,身体.下面是最最小的仪表面板页面的UI: ## ui. ...

  6. 仿SDWebImage

    仿SDWebImage 目标:模拟 SDWebImage 的实现 说明:整体代码与之前博客上的演练代码的基本一致,只是编写顺序会有变化! 在模仿 SDWebImage 之前,首先需要补充一个知识点:N ...

  7. Qt学习总结-ui篇

    控件设置透明度: QGraphicsOpacityEffect *effect = new QGraphicsOpacityEffect(this); effect->setOpacity(0. ...

  8. ios开发——实用技术篇&Pist转模型详细介绍

    Pist转模型详细介绍 关于Plist转模型在iOS开发中是非常常见的,每开一一个项目或者实现一个功能都要用到它,所以今天就给大家讲讲Plist怎么转成模型数据, 前提:必须有一个Plist文件或者通 ...

  9. Android添加桌面快捷方式的简单实现

    核心代码如下: Button bn = (Button) findViewById(R.id.bn); // 为按钮的单击事件添加监听器 bn.setOnClickListener(new OnCli ...

  10. SuperMap

    SuperMap iClient for JavaScript 新手入门 地理信息系统(英语:Geographic Information System,缩写:GIS)是一门综合性学科,结合地理学与地 ...

随机推荐

  1. Windows 11在使用AMD时，CPU占用率持续100%的解决方案

    一.现象 Windows 11在使用AMD时,CPU占用率持续100%,持续好几个系统版本都是如此 二.系统版本: 版本 Windows 11 专业工作站版版本 22H2安装日期 ‎2022/‎10/ ...

  2. Git下载、安装与配置

    1.Git下载:   访问Git官网,下载对应操作系统的的安装包.   这里笔者是64位机器,选择如下: 2.Git安装:   打开安装包进行安装:   一路next到Finish:   在CMD中输 ...

  3. 2022-05-13内部群每日三题-清辉PMP

    1.一个运营团队认为他们的技能在项目上是不必要的,团队士气低落,且团队成员试图阻止项目实现目标.项目经理应该怎么做? A.建议公司改变战略,并立即停止项目 B.要求工会的支持来激励团队 C.根据项目成 ...

  4. MySQL Workbench部分出错及可能解决方案

    出错一:8.0.23.0版本,在workbench内建立表eg1,select * from eg1无返回结果,无法向表内导入数据,在如下图的下一步,workbench会直接闪退 可行的办法:(不建议 ...

  5. 使用JIMO ActionOne HongHu 及其他MR VR眼镜，将真实场景和游戏内场景混合渲染

    1. 在VR相机Head内创建一个 Camera 和两个RawImage(Camera 的参数和VRCamera的参数一致, 两个RawImage尺寸一致, 要把VRCamera的相机遮挡住 ) 2. ...

  6. matlab如何关闭figure

    如果想要关闭之前打开的figure,用**close()**函数就可以了. close(H):关闭句柄为H的figure: close('name'):关闭指定name的figure: close a ...

  7. 解决使用mapstruct过程中的一次编译报错问题_Internal error in the mapping processor

    说明 mapstruct版本:1.2.0.Final 开发工具:IntelliJ IDEA 2021.3.1 (Ultimate Edition) 报错现象 java: Internal error ...

  8. CVE-2023-25813 漏洞

    自己使用Nestjs 搭配 Sequelize ,在安装新包的时候提示有Critical 风险.有漏洞嘛,要第一时间处理,要处理,除了升级,还要看一下这个漏洞如何复现. 粗略得到结果如下: CVE-2 ...

  9. 25 String 对象中的属性

    <!DOCTYPE html> <html lang="en">   <head>     <meta charset="UTF ...

  10. iOS Programing

    ARC 1. ARC - Automatic Reference Counting 办公室照明原理 2. 函数release立即释放,autorelease进入autoreleasepool里 3. ...