在信息窗口谷歌地图 API 中显示 mysql 表数据答案

【问题标题】：Display mysql table data in info window Google map API在信息窗口谷歌地图 API 中显示 mysql 表数据
【发布时间】：2015-10-24 03:20:04
【问题描述】：

我是 google MAPS API 的新手，我想获得一些帮助。我正在使用 ajax 从 mysql 数据库在我的网站上绘制多边形，它工作正常。 Ajax 代码是

function checkbox(clicked_id)
    {   

        var checkbox = document.getElementById(clicked_id);
        if(checkbox.checked==true)
        {
             // coordintaes for routes 

            // Get coordinates of route and display it
            for(m=1;m<=36;m++){

                //alert(m);
            $.ajax({
            url: "route_query4district1.php?id="+m,
            dataType: 'json',
            success: function (msg1) 
            { 
            xarray1 = new Array();
             yarray1 = new Array();
             color1 = new Array();
             new_id = new Array();
             dist_name = new Array();
            js_data1 = eval(msg1);
                //alert(js_data1);
                var k1=0;
                for(j1=0;j1<js_data1.length;j1+=5){
                xarray1[k1] = js_data1[j1];
                yarray1[k1] = js_data1[j1+1];
                color1[k1] = js_data1[j1+2];
                new_id[0] = js_data1[j1+3];
                dist_name[0] = js_data1[j1+4];
                k1++;
                }
            //alert(dist_name);
                var flightPlanCoordinates = new Array();
                for(i=0;i<xarray1.length;i++){
                 flightPlanCoordinates[i] = new google.maps.LatLng(yarray1[i], xarray1[i]);
                }

                var line_color="#00000";
                var stroke_color=line_color.toString();
                var linee_color=color1[m];
                var strokee_color=linee_color.toString();
                flightPath[m] = new google.maps.Polygon({
                    path: flightPlanCoordinates,
                    strokeColor: stroke_color,
                    fillColor: strokee_color,
                    strokeOpacity: 1.0,
                    strokeWeight: 4


              });

              flightPath[m].setMap(map);
             google.maps.event.addListener(flightPath[m], 'click', showArrays);
            infoWindow = new google.maps.InfoWindow();      

            } 
            });
            }

        }

现在我想在信息窗口谷歌地图 APi 中显示与每个多边形关联的属性数据。我该怎么做？我想显示以下信息。名称保存在几何表中并具有唯一的 ID，通过该 ID 几何与其他表相关联。 $ 符号用作 php 变量，通过它从数据库中获取数据

名称:$name, 人口：$pop，面积：$面积

【问题讨论】：

标签： javascript php arrays arraylist

【解决方案1】：

你可以试试这个

flightPath[m] = new google.maps.Polygon({
                    path: flightPlanCoordinates,
                    strokeColor: stroke_color,
                    fillColor: strokee_color,
                    strokeOpacity: 1.0,
                    strokeWeight: 4,
                    id: m
              });  

//Create the info window
var infowindow = new google.maps.InfoWindow({
    width:...,
    ...
});

//Add it to object with the same key as your flightpaths
infowindows[m] = infowindow.

//Set event listener for mouse over
google.maps.event.addListener(flightPath[m], 'mouseover', function(){
    setContent(this.id);
});

google.maps.event.addListener(flightPath[m], 'mouseout', function(){
    infowindows[this.id].close();
});

//mouseover function
var setContent = function(id)
{
    //build your html. This is where you'd get your variables from php. Ajax or save them to a js variable.
    infowindows[id].setContent(html);
    infowindows[id].open(map, flightPath[id]);
};

【讨论】：