Question

我正在使用Google地图API。我的申请应该按以下方式运作：

用户点击Google地图，在infoWindow中打开一个表单
点击下一个表单时，应该在相同的坐标上打开问题在这里，我无法在此位置打开第二个表单并收到以下错误

TypeError：g未定义源文件： https://maps.googleapis.com/maps-api-v3/api/js/22/14/infowindow.js 行：8

下面是我的代码＆amp;我相信问题就在这里

infowindowtwo.open（map，newmarker）;

<script type="text/javascript">
    var marker;
    var infowindow;
    var infowindwotwo;

   function initialize() {
      var latlng = new google.maps.LatLng(37.4419, -122.1419);
      var options = {
        zoom: 13,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      var map = new google.maps.Map(document.getElementById("map"), options);


      var html = "<table>" +
                 "<tr><td>Name:</td> <td><input type='text' id='name'/> </td> </tr>" +
                 "<tr><td>Address:</td> <td><input type='text' id='address'/></td> </tr>" +
                  "<tr><td>hidden:</td> <td><input type='text' value='aa' id='latlong' /></td> </tr>" +
                 "<tr><td>Type:</td> <td><select id='type'>" +
                 "<option value='bar' SELECTED>bar</option>" +
                 "<option value='restaurant'>restaurant</option>" +
                 "</select> </td></tr>" +
                 "<tr><td></td><td><input type='button' id='btnone' value='Next' onclick='phasetwo()'/></td></tr>";

    infowindow = new google.maps.InfoWindow({
     content: html
    });
      google.maps.event.addListener(map, "click", function(event) {
     //making marker here
        marker = new google.maps.Marker({
          position: event.latLng,
          map: map
        });
      google.maps.event.addListener(marker, "click", function() {
             $("#test").val(event.latLng);
             infowindow.open(map, marker);
        });
    });
  }
//-------------------------------------------------------------------------
    function phasetwo()
    {
        alert(123);
         var testp = $("#test").val();
         alert(testp);
         var htmltwo = "<table>" +
                 "<tr><td>Name2:</td> <td><input type='text' id='name'/> </td> </tr>" +
                 "<tr><td>Type2:</td> <td><select id='type'>" +
                 "<option value='bar' SELECTED>bar</option>" +
                 "<option value='restaurant'>restaurant</option>" +
                 "</select> </td></tr>" +
                 "<tr><td></td><td><input type='button' value='Save ' onclick='phasetwo()'/></td></tr>";


                infowindowtwo = new google.maps.InfoWindow({
                 content: htmltwo
                });

                var newmarker = new google.maps.Marker({
                position: testp,
                map: map,
                title: htmltwo
            });
        infowindow.close();
            //  infowindowtwo.open(map, newmarker);
                alert(2);
            infowindowtwo.open(map, newmarker);
                alert(3);
        // marker.push(newmarker);
        }

   function saveData() {
      var name = escape(document.getElementById("name").value);
      var address = escape(document.getElementById("address").value);
      var type = document.getElementById("type").value;
      var latlng = marker.getPosition();

      var url = "phpsqlinfo_addrow.php?name=" + name + "&address=" + address +
                "&type=" + type + "&lat=" + latlng.lat() + "&lng=" + latlng.lng();
      downloadUrl(url, function(data, responseCode) {
        if (responseCode == 200 && data.length >= 1) {
          infowindow.close();
          document.getElementById("message").innerHTML = "Location added.";
        }
      });
    }

    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request.responseText, request.status);
        }
      };
    request.open('GET', url, true);
      request.send(null);
    }
  function doNothing() {}
    </script>

谢谢。

Answer 1

我的代码Ls = [one, three, two, five] ;出现javascript错误，因为InvalidValueError: setMap: not an instance of Map; and not an instance of StreetViewPanorama变量是initialize函数的本地变量。最简单的修复，使其成为全局（在初始化函数之外移动声明，在函数运行时初始化）：

map

一旦解决了这个问题，我就会收到一个javascript错误：var map; function initialize() { var latlng = new google.maps.LatLng(37.4419, -122.1419); var options = { zoom: 13, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map"), options);。

您遇到InvalidValueError: setPosition: not a LatLng or LatLngLiteral: not an Object问题，它是字符串（如“（37.46297753913022，-122.15921401977539）”），而不是testp或LatLng。

您可以解析它以生成有效的LatLng（或LatLngLiteral）：

LatLngLiteral

proof of concept fiddle

代码段

testp = testp.replace(/[{()}]/g, '');
var coords = testp.split(',');
var pt = new google.maps.LatLng(coords[0],coords[1]);
var newmarker = new google.maps.Marker({
  position: pt,
  map: map,
  title: htmltwo
});

var marker;
var infowindow;
var infowindowtwo;
var map;

function initialize() {
    var latlng = new google.maps.LatLng(37.4419, -122.1419);
    var options = {
      zoom: 13,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map"), options);


    var html = "<table>" +
      "<tr><td>Name:</td> <td><input type='text' id='name'/> </td> </tr>" +
      "<tr><td>Address:</td> <td><input type='text' id='address'/></td> </tr>" +
      "<tr><td>hidden:</td> <td><input type='text' value='aa' id='latlong' /></td> </tr>" +
      "<tr><td>Type:</td> <td><select id='type'>" +
      "<option value='bar' SELECTED>bar</option>" +
      "<option value='restaurant'>restaurant</option>" +
      "</select> </td></tr>" +
      "<tr><td></td><td><input type='button' id='btnone' value='Next' onclick='phasetwo()'/></td></tr>";

    infowindow = new google.maps.InfoWindow({
      content: html
    });
    google.maps.event.addListener(map, "click", function(event) {
      //making marker here
      marker = new google.maps.Marker({
        position: event.latLng,
        map: map
      });
      google.maps.event.addListener(marker, "click", function() {
        $("#test").val(event.latLng);
        infowindow.open(map, marker);
      });
    });
  }
  //-------------------------------------------------------------------------

function phasetwo() {
  // alert(123);
  var testp = $("#test").val();
  // alert(testp);
  var htmltwo = "<table>" +
    "<tr><td>Name2:</td> <td><input type='text' id='name'/> </td> </tr>" +
    "<tr><td>Type2:</td> <td><select id='type'>" +
    "<option value='bar' SELECTED>bar</option>" +
    "<option value='restaurant'>restaurant</option>" +
    "</select> </td></tr>" +
    "<tr><td></td><td><input type='button' value='Save ' onclick='phasetwo()'/></td></tr>";


  infowindowtwo = new google.maps.InfoWindow({
    content: htmltwo
  });
  testp = testp.replace(/[{()}]/g, '');
  var coords = testp.split(',');
  var pt = new google.maps.LatLng(coords[0], coords[1]);
  var newmarker = new google.maps.Marker({
    position: pt,
    map: map,
    title: htmltwo
  });
  infowindow.close();
  //  infowindowtwo.open(map, newmarker);
  // alert(2);
  infowindowtwo.open(map, newmarker);
  // alert(3);
  // marker.push(newmarker);
}

function saveData() {
  var name = escape(document.getElementById("name").value);
  var address = escape(document.getElementById("address").value);
  var type = document.getElementById("type").value;
  var latlng = marker.getPosition();

  var url = "phpsqlinfo_addrow.php?name=" + name + "&address=" + address +
    "&type=" + type + "&lat=" + latlng.lat() + "&lng=" + latlng.lng();
  downloadUrl(url, function(data, responseCode) {
    if (responseCode == 200 && data.length >= 1) {
      infowindow.close();
      document.getElementById("message").innerHTML = "Location added.";
    }
  });
}

function downloadUrl(url, callback) {
  var request = window.ActiveXObject ?
    new ActiveXObject('Microsoft.XMLHTTP') :
    new XMLHttpRequest;

  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      request.onreadystatechange = doNothing;
      callback(request.responseText, request.status);
    }
  };
  request.open('GET', url, true);
  request.send(null);
}

function doNothing() {}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

TypeError：g未定义Google Map API

1 个答案: