html - 没有 domlistner 地图不显示

Question

我想在某些功能的触发器上绘制一个多边形。我创建了一个按钮提交，它启动插入功能，从用户那里获取坐标并调用显示功能。

var map; var triangleCoords = [];
function insert() {
    

        //var markerImage = 'assets/img/marker.png';

       // var marker = new google.maps.Marker({
            // position: location,
            // map: map,
            // icon: markerImage
        // });
		
		triangleCoords = [
    [30.983611, 73.332778],
    [30.93361111, 73.33055556],
    [30.93361111, 73.43055556],
    [30.98111111, 73.42944444]
  ];
    

    
	display();
	
}

function display()
 {
 function initMap() {

        var location = new google.maps.LatLng(31.1704, 72.7097);

        var mapCanvas = document.getElementById('map');
        var mapOptions = {
            center: location,
            zoom: 7,
            panControl: false
            // mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(mapCanvas, mapOptions);


  var points = [];
  for (var i = 0; i < triangleCoords.length; i++) {
    points.push({
      lat: triangleCoords[i][0],
      lng: triangleCoords[i][1]
    });
  }
  // Construct the polygon.
  var bermudaTriangle = new google.maps.Polygon({
    paths: points,
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
	zoom: 13,
    fillColor: '#FF0000',
    fillOpacity: 0.35
  });
  bermudaTriangle.setMap(map);
}
google.maps.event.addDomListener(window,'load',initMap);
 }

代码工作正常，但如果我删除 google.maps.event.addDomListener(window,'load',initMap); 线图不显示。我的提交按钮清除表单。

标签： htmlgoogle-maps