使用自己的地图,如谷歌地图。当访问者点击地图上的点时收集和处理数据

Posted

技术标签:

【中文标题】使用自己的地图,如谷歌地图。当访问者点击地图上的点时收集和处理数据【英文标题】:Use own map like Google map. Collect and process data when visitors click spots on map 【发布时间】:2016-10-08 09:27:48 【问题描述】:

我正在做一个与旅行相关的网站项目。我想了很久,在网上搜索了很久。但是我仍然不知道如何开始。我真的需要帮助。

先简单介绍一下我的旅游项目。

我需要使用自己的地图。它可以像谷歌地图一样放大或缩小。地图上有很多风景点,比如A点、B点、C点等等......

当访问者打开地图时,点击点,例如点Y、点A、点M等......我需要得到他们点击了哪些点,对所有数据进行分组,最后写入数据进入 mysql 数据库。

这是我到现在为止的发现:

我发现了很多jQuery插件和工具,比如OpenLayers、mapTiler、mapBox等。它们都使用Google Map、Open Street Map等地图,但不允许使用自己的地图。

我还找到了 Gmap Image Cutter,它可以将我的大地图切割成图块并显示在网络上。但是不能点击地图按要求获取数据。

我的问题:

我可以掌握 php 和 jQuery。

有人可以告诉我如何开始吗?

哪些工具或插件可以最好地完成我的项目?

谢谢

【问题讨论】:

您尝试做的事情似乎很困难。如果您尝试通过单击地图来收集经度和纬度并允许用户缩放并仍然收集地图位置,那么您将不得不编写大量代码。这就是为什么谷歌地图和其他地图很受欢迎。为什么一定要用自己的地图?您可以在您的网站中嵌入第三方地图,并且您可以免费使用谷歌地图,每天最多达到一定的配额。你想要做的事情需要几个月的时间才能完成。 but not allow to use own map自己的地图是什么意思?它在地球上吗?您可以使用 google-maps 显示您自己的地图,知道吗? 我希望使用自己的地图,因为我希望使用仅突出显示感兴趣地点的地图。谷歌地图有太多我不需要的信息。 是的,我知道我可以使用 google-maps 显示我自己的地图。其实我已经用了好几年了。我希望使用我自己的地图,它对我的​​访问者来说更容易使用。 其实我并不是想通过点击地图来收集经度和纬度。我会在地图上画一些点,比如伦敦、温布利、霍洛威等等……我希望得到点击的名字。 【参考方案1】:

Google Maps javascript API 提供了一个 OverlayView 类,用于创建您自己的自定义叠加层。

文档链接:https://developers.google.com/maps/documentation/javascript/customoverlays#subclass

示例链接:https://developers.google.com/maps/documentation/javascript/examples/overlay-hideshow

最后但并非最不重要的一点是,Google 地图可以嵌入到您的网站中:https://developers.google.com/maps/documentation/embed/

【讨论】:

您好 Gjermund,感谢您的信息。覆盖似乎是一个可能的解决方案。但是放大时覆盖图不清晰。 @Alex 我自己对叠加层没有太多经验,我建议您为此提出一个新问题。 您可能想查看 html <map><area> tags。这些将允许您在地图图像的顶部定义点和形状。这些点和形状上的单击事件可以绑定到 jQuery 并由 jQuery 管理。还有像image-maps.com 这样的工具可以简化代码定义。 您好 Gjermund,是的,我可以使用 html 和 标签来定义地图图像顶部的点和形状。由于大地图被切割成许多瓷砖并定位到不同的图层中。我不知道如何获取层号和图块 ID。 Gmap Image Cutter 可能不是最好的答案 - 最后一次更新已经 2 年了,显然没有得到维护。您可以只使用一张高清图像,使用地图/区域标签来定义兴趣点。

以上是关于使用自己的地图,如谷歌地图。当访问者点击地图上的点时收集和处理数据的主要内容,如果未能解决你的问题,请参考以下文章

如何显示启用位置对话框,如谷歌地图?

如何显示启用位置对话框,如谷歌地图?

谷歌地图:当用户足够近时,如何使标记仅可点击?

当用户点击地图图钉时动态更改图标图像文件:谷歌地图

Django - 当用户选择地图上的点时,如何以模式形式包含地图并将坐标保存到数据库?

地图悬停和点击谷歌地图