Google Map如何在map-active.js中添加第二个位置

时间:2018-12-06 04:04:18

标签: javascript java jquery html google-maps

您好朋友,我无法找到map-active.js文件的解决方案,我认为JS专家可以轻松完成工作,您能帮我吗,我将分享map-active.js文件 这里只提到一个位置,我想再增加一个位置 ...?

// google map
function initialize() {
	 var grayStyles =[{"featureType":"water","elementType":"geometry","stylers":[{"color":"#e9e9e9"},{"lightness":17}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#f5f5f5"},{"lightness":20}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#ffffff"},{"lightness":17}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#ffffff"},{"lightness":29},{"weight":0.2}]},{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":18}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":16}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#f5f5f5"},{"lightness":21}]},{"featureType":"poi.park","elementType":"geometry","stylers":[{"color":"#dedede"},{"lightness":21}]},{"elementType":"labels.text.stroke","stylers":[{"visibility":"on"},{"color":"#ffffff"},{"lightness":16}]},{"elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#333333"},{"lightness":40}]},{"elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#f2f2f2"},{"lightness":19}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#fefefe"},{"lightness":20}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#fefefe"},{"lightness":17},{"weight":1.2}]}] 
	var mapOptions = {
	zoom: 12,
	styles: grayStyles,
	hue: '#E9E5DC',
	scrollwheel: false,
		center: new google.maps.LatLng(9.967027, 76.243499),
		
	};
	var map = new google.maps.Map(document.getElementById('googleMap'),
	mapOptions);
	  var marker = new google.maps.Marker({
		position: map.getCenter(),
		animation:google.maps.Animation.BOUNCE,
		icon: './assets/img/map.png',
		map: map
	});  
}
google.maps.event.addDomListener(window, 'load', initialize);    

1 个答案:

答案 0 :(得分:2)

就像您添加第一个位置一样,以同样的方式创建附加到同一地图的新标记。

var marker1 = new google.maps.Marker({
        position: {lat: LOCATION_1_LAT, lng: LOCATION_1_LON},
        animation:google.maps.Animation.BOUNCE,
        icon: './assets/img/map.png',
        map: map
    });

var marker2 = new google.maps.Marker({
            position: {lat: LOCATION_2_LAT, lng: LOCATION_2_LON},
            animation:google.maps.Animation.BOUNCE,
            icon: './assets/img/map.png',
            map: map
        });

此处演示: https://jsfiddle.net/sz9gkox6/