Javascript PHP/MySQL和KML,动态生成的标记

Javascript PHP/MySQL和KML,动态生成的标记,javascript,php,jquery,mysql,google-maps,Javascript,Php,Jquery,Mysql,Google Maps,因此,我目前正在开发这个谷歌地图引擎,它有几个交替的部分: 1用户选择他们想要查看的站点,单击提交 2表单激活为谷歌地图输出xml的.php 3谷歌地图模块从.php重新加载带有用户请求标记的地图 我的问题是,我希望表单提交信息,停留在页面上,谷歌地图模块刷新并显示新标记。它实际做的是将用户带到.php,它当然会显示XML输出 我已经研究过将AJAX原则应用到javascript中,但我使用的东西都不管用,我在web开发这方面仍然非常缺乏经验。代码在下面,我的地图没有正确居中,它应该以华盛顿特区

因此,我目前正在开发这个谷歌地图引擎,它有几个交替的部分:

1用户选择他们想要查看的站点,单击提交

2表单激活为谷歌地图输出xml的.php

3谷歌地图模块从.php重新加载带有用户请求标记的地图

我的问题是,我希望表单提交信息,停留在页面上,谷歌地图模块刷新并显示新标记。它实际做的是将用户带到.php,它当然会显示XML输出

我已经研究过将AJAX原则应用到javascript中,但我使用的东西都不管用,我在web开发这方面仍然非常缺乏经验。代码在下面,我的地图没有正确居中,它应该以华盛顿特区为中心

HTML/Javascript代码

PHP代码 请记住,表单正在与PHP对话并返回用户选择的适当值,问题在于让表单提交记住数据、查询sql数据库、打印xml,然后在不离开页面的情况下使用它填充地图。另外,值得指出的是,当javascript是静态文件时,我已经将其加载到了.php文件中,并且我输入了一些值

非常感谢您的帮助,如果我不清楚,请告诉我

谢谢, Logan

忘记KML/KmlLayer,使用由提供的可绘制对象。使用AJAX调用来检索创建和在回调中呈现所需的信息

例如:

function loadStation(stationId) {
    $.json({
        // Your PHP file / REST API
        url: 'http://foo.bar/api/stations/' + encodeURIComponent(stationId)
    }).done(function (data) {
        // assuming 'map' is a reference to the google map object
        for (var m in data) {
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(m.lat, m.lng),
                map: map,
                title: m.title
            });
        }
    });
}

/*
 * TODO: Register an event handler that calls the loadStation() function
 * when the user selects a station
 */

在我看来,KML是一种相当静态的性质,非常适合存储已录制且不受更改影响的内容。

我知道这将如何生成新的标记,但这将如何影响HTML表单?问题是,当客户端提交站点选择时,浏览器会加载php文件。任何链接都将不胜感激,谢谢!
$station = $_POST['station']; 

define("DB_SERVER", "some.server.com"); 
define("DB_USER", "some_user"); 
define("DB_PASSWORD", "some_password"); 
define("DB_NAME", "some_db"); 
define("DB_TABLE", "some_table");  


header("Content-type: application/xml"); 

// Print the head of the document 

printf("<?xml version=\"1.0\" encoding=\"UTF-8\"?> 
<kml xmlns=\"http://earth.google.com/kml/2.0\"> 
<Document>");

if ($db = mysqli_connect(DB_SERVER, DB_USER, DB_PASSWORD)) { mysqli_select_db($db, DB_NAME); 
$query = " SELECT * FROM markers " ;

// You could add some WHERE statements here to filter the data 
// DESC means newest first 

$query .= " WHERE stations "; 

$query .= "LIKE '$station'";

// Finally query the database data 

$result = mysqli_query($db, $query) or die(mysqli_error($db));

// Now iterate over all placemarks (rows) 

while ($row = mysqli_fetch_object($result)) { 

// This writes out a placemark with some data 
// -- Modify for your case -- 

printf(' <Placemark id="%d"> 
<name>%s</name> 
<Point> 
<coordinates>%f,%f</coordinates> 
<Price>%s</Price>
<Bedrooms>%s</Bedrooms>
<Bathrooms>%s</Bathrooms>
<Distance>%s</Distance>
<Stations>%s</Stations>
</Point> 
</Placemark>', 
htmlspecialchars($row->id), 
htmlspecialchars($row->address),  
htmlspecialchars($row->lng), 
htmlspecialchars($row->lat),
htmlspecialchars($row->price),
htmlspecialchars($row->bedrooms),
htmlspecialchars($row->bathrooms),
htmlspecialchars($row->distance),
htmlspecialchars($row->stations) ); }; 

// Close the database connection 

mysqli_close($db); };

// And finish the document 

printf(" </Document> </kml>");

?>
function loadStation(stationId) {
    $.json({
        // Your PHP file / REST API
        url: 'http://foo.bar/api/stations/' + encodeURIComponent(stationId)
    }).done(function (data) {
        // assuming 'map' is a reference to the google map object
        for (var m in data) {
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(m.lat, m.lng),
                map: map,
                title: m.title
            });
        }
    });
}

/*
 * TODO: Register an event handler that calls the loadStation() function
 * when the user selects a station
 */