根据图片中心点经纬度，计算图片四角的经纬度，并添加到地图中

 leaflet 详情总目录：传送 

        如何把图片在地图中显示？这里分两种情况：1、格式为tif，可以使用 L.imageOverlay，这个是使用geoserver的栅格数据展示图片，具体方法可以查看ImageMosaic 这篇文章；2、png/jpg等格式，如果知道图片对角经纬度，可以直接使用 L.imageOverlay 直接添加即可；如果仅有图片中心点经纬度，这里就需要通过计算来获取图片对角经纬度；如果没有图片相关的经纬度，那就放弃吧！

先看效果图：

今天主要是说一下根据图片中心点经纬度计算图片对角经纬度：

需要计算图片对角经纬度，就需要一些前提条件，如果没办法满足，这篇文章对你也就没啥作用了，不看也罢。

前提条件：1、相机传感器尺寸；2、相机拍摄分辨率；3、相机镜头焦距；4、拍摄高度。

计算公式：GSD = H * a / f；a = 传感器 / 分辨率； 

公式解释：H：拍摄高度 (m)；f：相机镜头焦距 (mm)；GSD：图片中每像素的真实距离 (m)

例如：传感器：35.7mm x 23.8mm ；拍摄分辨率：9504x6336；相机镜头焦距：40mm；拍摄高度：1000m；则：a = 35.7mm / 9504 = 0.00376mm（23.8mm / 6336 = 0.00376mm）；GSD = 1000m * 0.00376mm / 40mm = 0.094m。（这些参数可以查看相机参数，或者问一下购买相机的客服）

前提条件已经准备好了，接下来直接上代码：

        /**
		 * 计算图片对角经纬度
		 * center 中心的坐标 
		 * latLength 图片高度像素
		 * lngLength 图片宽度像素
		 * gsd 
		 */
		computeLatlngByCenter(center, gsd, latLength, lngLength) {
			const latlng = center;
			let width = latLength * gsd;
			let height = lngLength * gsd;
			let one_lng_length = ((40076 * 1000) / 360) * Math.cos((latlng[0] * Math.PI) / 180);
            let one_lat_length = 111320 
			let lngOffSet = width / 2 / one_lng_length; 
			let latOffSet = height / one_lat_length / 2; 
			let north = latlng[0] + latOffSet;
			let south = latlng[0] - latOffSet;
			let east = latlng[1] + lngOffSet;
			let west = latlng[1] - lngOffSet;
			return [
				[north, west],
				[south, east],
			];
		},

注释：one_lng_length ：1经度对应的纬线长度；one_lat_length ：1纬度对应的经线长度，这个值是固定的；40076：赤道周长。以上数值都是在地球是圆形的基础上，和实际情况是有差距的，如果需要非常精确的数值，那这个方法就不合适了。

按照上面方法就可以算出图片对角的经纬度了，接下来就是把图片显示在地图上了：

        addImageLayer() {
			this.imageList = [
				{
					url: '/src/assets/image/A_01_DSC00520.jpg',
					center: [29.048664363492595, 119.76427712337504],
					height: 1000,
                    width:6336,
                    height:9504
				},
			];
			this.imageList.forEach((item) => {
				let gsd = 0.092;
				let imageBounds = this.computeLatlngByCenter(item.center, gsd,item.width,item.height);
				L.imageOverlay(item.url, imageBounds).addTo(this.map);
			});
		},