[VUE+Leaflet开发案例一][海洋环境监测系统] 第8章 添加坐标实时显示控件

前言

本系列文章的主题是详细分享一个基于VUE+Leaflet应用框架的WebGIS前端系统开发案例，从应用场景、开发技术、开发环境、开发调试、功能开发、系统发布等多个开发过程进行详细讲解及代码分享。

---

系列文章目录

---

一、功能实现效果

本章节继续为地图添加当前坐标实时显示控件功能，效果如下图所示。

---

二、功能实现代码

1、在页面左下角添加坐标显示的DIV图层控件，如下图所示。

<template>
    <div id="map"></div>
    <div id="div_xy">&nbsp;经度:-&nbsp;纬度:-&nbsp;</div>
</template