Question

我想建立一个以州的地图为背景的网页。当鼠标悬停在城市上方时，鼠标指针附近会弹出一个小窗口，并显示有关该城市的一些信息。

我记不起任何已实施此功能的网站。类似的示例是Google地图，但是，用户需要点击某个位置才能显示该位置的信息。

任何人都知道这种网页吗？我怎样才能构建这样的网页？

Answer 1

我使用谷歌地图及其infowindow功能，

快速启动将如下所示;

    <!--load the api in your html side-->
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&language=es&region=ES"></script> 

    <!--place a map canvas with a selector inside your <body> tags-->
    <div id="gmap_div" style="width:400px;height:400px;"></div>

    <!-- then initialize it and work with the map object; -->
    <body onload="initialize()">

/* the javascript */

        function initialize() {


                mapOptions = {
                  center: new google.maps.LatLng(40.41678, -3.70379),
                  zoom: 12,
                  mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                map = new google.maps.Map(document.getElementById("gmap_div"),
                    mapOptions);

            }

这是一个gmaps的开始，然后它不是很难创建窗口或附加事件。

您可以在此处找到所有gmap文档：

[https://developers.google.com/maps/documentation/javascript/?hl=en][1]

Answer 2

但是我建议你传单： www.leafletjs.com

Leaflet是当今最受欢迎的js地图库。如果您知道如何使用JS，那么您将无需担心传单。它有很好的记录。以下是一些传单教程： http://leafletjs.com/examples/quick-start.html

如何用javascript实现交互式地图？

2 个答案: