谷歌地图API -标记，MySQL

Google Maps API - Marker, MySQL

本文关键字：MySQL 标记 API 谷歌地图      更新时间：2023-09-26

我读过关于谷歌的地理编码服务，它允许命名的位置(如曼彻斯特)映射到从谷歌的数据库坐标，以便标记可以放置在谷歌地图:https://developers.google.com/maps/documentation/javascript/geocoding#Geocoding

在我的情况下，我有一个MySQL数据库表jobs定义。在这个表中，我存储了(意料之中的)工作信息，例如工资、职称、推荐信等。在这个表中，还有一列用于作业位置。大多数情况下包含城市(或城市加邮政编码)。奇数次，它要么为NULL，要么有一个字符串，如"No location specified"。

为了查看这些记录，我在我的测试机器上运行了一个web服务器，我在浏览器中使用一些HTML和通用php脚本(DB驱动的内部网页面)显示表的记录。

我现在把这个页面分成了两个部分。使用Google Maps v3 API，我的下半部分包含了Google Map。我想要达到的是:

    的位置字符串自动放置标记列位置。
  • 可点击的标记，点击后产生信息窗口(将包含职位名称等)。

我想知道的是做这件事的最好方法是什么?

我在SO上读过一些类似的帖子，那里的用户有类似的情况。从这些读数中，我可以确定一些OP已经努力在将其记录插入表时存储其记录位置的长/lat，然后用Javascript读取长/lat以生成标记。

要做到这一点，我需要修改一些代码和表。这是一种选择，但我更愿意探索另一种可能是使用谷歌的地理编码服务?有人有过这样的经历吗?你有什么建议吗?

同样，假设我使用了后一个选项。我使用PHP脚本从数据库加载记录。我如何将位置传递给Javascript，以便Google Map API可以通过Geocoding服务进行长/晚查询?这是不是一种不太理想的实现方式?

谢谢。

只需使用Gmap3 Library，并提供一个地址…像这样…http://gmap3.net/en/catalog/18 -数据- types/address - 63

设置div…

  <div id="test" width=500 height=500></div>
然后你的Jquery将地图插入到div.... 
$("#test").gmap3({
marker:{
  address: "Haltern am See, Weseler Str. 151"
},
map:{
  options:{
    zoom: 14
  }
}
});

地址可以从你的PHP回显(尽管这被认为是不好的做法)

$("#test").gmap3({
marker:{
  address: '<?php echo $addressfromDB;?>'
},
map:{
  options:{
    zoom: 14
  }
}
});

但是最好做一个ajax调用，然后在成功回调

中包含这段代码
   $.getJSON('getlocation.php', function(data){
        $("#test").gmap3({
          marker:{
          address: data.address // or whatever structure your json is in.
          },
        map:{
          options:{
            zoom: 14
           }
          }
          });
   });

你应该可以开始了:)

听起来除了Javascript和从PHP脚本获取数据的方式之外，一切都准备就绪了。

那么，让我们从从PHP脚本获取数据到Javascript开始。做到这一点的方法是使用AJAX(学习它，不是官方来源:http://www.w3schools.com/ajax/ajax_intro.asp)。一旦网页已经加载，Javascript可以通过使用XMLHttpRequest对象(或者jQuery.ajax()，如果你喜欢使用Javascript框架)加载更多的信息。基本上，这是Javascript在后台加载一个新页面，然后自己处理内容。您需要设置PHP脚本(或者编写另一个脚本—我对这部分不熟悉)，以便在访问的页面之外的单独URI中提供所需的信息。然后在Javascript XMLHttpRequest中使用这个URI。通常情况下，您会让PHP脚本以易于计算机理解的形式提供数据，例如JSON(推荐)或XML(相对于易于人类理解的HTML -一旦呈现)。这个过程称为API。在JavaScript中，您将使用JSON.parse()将响应文本转换为您可以使用的实际变量。

在Javascript中获得地址后，使用您提到的地理编码API将它们转换为GPS坐标，然后使用Google Maps Javascript API在地图上放置标记:https://developers.google.com/maps/documentation/javascript/overlays#Markers。你也可以添加一个信息窗口(在上面的页面中搜索infowindows -显然我只能包含2个链接)。

正如您所提到的，对所有地址进行地理编码并将纬度存储在数据库中可能是一个更好的主意。这样做的最大原因是，如果您在Javascript中进行如上所述的地理编码，那么每次用户加载页面时，都会重新进行地理编码。这有两个问题:1。对谷歌来说，这是一项耗费资源的昂贵操作。2. 对您来说，这意味着需要更长的时间来填充地图(因为您必须等待Google对AJAX调用的响应-地理编码调用，而不是您将实现的响应)，并且您可能会遇到Google的使用限制，因为1。如果你决定提前进行地理编码并将结果存储在数据库中，你应该使用"谷歌地理编码API"，而不是Javascript地理编码服务。我不能添加另一个链接到它，但只需谷歌"谷歌地理编码API"。

我希望这有帮助，如果有人想用更多的链接更新我的答案，请随意。

相关文章：