mapbox加载geojson点位，点击点，该点高亮（点位图片放大）

let sourceData : AnyObject = {
	type: 'FeatureCollection',
	features: [],
};
/**
 * @Description: 撒点方法，地图加载geojson数据
 * @Author: wms
 * @param {any} mapObj 地图对象
 * @param {string} layerId 图层id
 * @param {any} sourceData 资源data
 * @param {string | string[]} icon 图标图片
 * @param {number | string[]} size 图标大小
 * @param {string} field 图标名称
 * @param {string} field1 鼠标移入图标名称
 * @param {string} textColor 图标名称
 * @param {boolean} textOverlap 文字避让
 * @param {any} textSize 文字大小
 * @param {any} textOffset 文字偏移量
 * @param {string} isVisibile 是否显示
 */
function addPointLayer(
	mapObj: any,
	layerId: string,
	sourceData: any,
	icon: string | string[],
	size: number | string[],
	field: string,
	field1: string,
	textColor: string,
	textOverlap: boolean,
	textSize: any,
	textOffset: any,
	isVisibile: string,
) {
	mapObj.addLayer({
		id: layerId,
		type: 'symbol',
		source: {
			type: 'geojson',
			data: sourceData,
		},
		layout: {
			'icon-image': icon, // 图片资源地址
			'icon-size': size, // 图片大小
			'icon-offset': [0, -60], // 图片偏移量
			'icon-allow-overlap': true, // 图片是否避让
			'text-allow-overlap': textOverlap, // 文字是否避让
			'text-optional': true, 
			'text-field': field, 
			'text-font': ['Microsoft YaHei Bold'],
			'text-size': textSize,
			'text-offset': textOffset,
			visibility: isVisibile,
		},
		paint: {
			'text-color': textColor,
			'text-halo-color': '#000',
			'text-halo-width': 1,
		},
	});
    
    // 鼠标移入显示field文字，移出则显示field1文字
	mapObj.on('mouseenter', layerId, () => {
		mapObj.setLayoutProperty(layerId, 'text-field', field);
	});
	mapObj.on('mouseleave', layerId, () => {
		mapObj.setLayoutProperty(layerId, 'text-field', field1);
	});
}

/**
 * @Descripttion: 点击点位图片添加放大图片图层
 * @param {any} map
 * @param {any} features 选中数据的features
 */
function addPointHighlight(map: any, features?: any[]) {
	features[0].layer.layout['icon-size'] =
		features[0].layer.layout['icon-size'] + 0.2;
	if (features[0].layer.layout['icon-image'].name) {
		features[0].layer.layout['icon-image'] = ['get', 'url'];
	}
	features[0].layer.layout['visibility'] = 'visible';

	map.setLayoutProperty(features[0].layer.id, 'icon-allow-overlap', false);

	if (!map.getSource('pointHighlight')) {
		map.addLayer({
			id: 'pointHighlight',
			type: 'symbol',
			source: {
				type: 'geojson',
				data: {
					type: 'FeatureCollection',
					features: [],
				},
			},
			layout: features[0].layer.layout,
			paint: {
				'text-color': '#fff',
				'text-halo-color': '#000',
				'text-halo-width': 1,
			},
		});
	}


/**
 * @Descripttion: 移除放大图片图层
 * @param {any} map
 * @param {any[]} features 选中数据的features
 */
function removePointHighlightLayer(
	map: any,
	features: any[],
) {
    // 判断是否有该图层，有该图层则修改图层属性，再移除该图层和图层资源
	if (map.getSource('pointHighlight')) {
		if (features.length != 0)
			map.setLayoutProperty(
				features[0].layer.id,
				'icon-allow-overlap',
				true,
			);
		map.removeLayer('pointHighlight');
		map.removeSource('pointHighlight');
	}
}