我有一个简单的AJAX,可以通过我的控制器从MYSQL获取所有数据,然后在搜索时以纬度和经度显示所有数据:
$(document).ready(function () {
$("#searchDataToMarker").keyup(function () {
var value = $(this).val();
$.ajax({
type: "POST",
url: "<?php echo base_url('Maps/mapSearchDataInMarker') ?>",
data: {
'searchDataToMarker': value
},
dataType: "JSON",
success: function (searchMapDataResult) {
if (searchMapDataResult.length !== null || $('searchDataToMarker').value !== '' || searchMapDataResult['latlong'] !== '') {
//we need to check if the value is the same
$("#searchResult").html(searchMapDataResult['lname']);
console.log(searchMapDataResult['lname']);
console.log(searchMapDataResult['latlong']);
var latlong = parseFloat(searchMapDataResult['latlong']);
var myLatLong = new google.maps.LatLng(7.289600,125.678066);
var iw = new google.maps.InfoWindow();
var myOptions = {
zoom: 15,
center: myLatLong,
mapTypeId: google.maps.MapTypeId.HYBRID
},
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var markerOptions = {
map: map,
position: myLatLong
};
marker = new google.maps.Marker(markerOptions);
//for (var i = 0, length = searchMapDataResult.length; i < length; i++) {
google.maps.event.addListener(marker, "click", function () {
iw.setContent(searchMapDataResult['lname']);
iw.open(map, marker);
});
//}
} else {
$("#searchResult").html('');
alertify.alert('Search result empty.').set('modal', false);
return;
}
}
});
});
});
和我的控制员:
class Maps extends CI_Controller() {
public function __construct() {
parent::__construct();
$this->load->Model('Login_model');
$this->load->Model('Maps_model');
}
public function mapSearchDataInMarker() {
if (isset($_POST['searchDataToMarker'])) {
$searchData = $_POST['searchDataToMarker'];
$query = $this->db->query("SELECT * FROM resident WHERE name LIKE '%{$searchData}%' OR mname LIKE '%{$searchData}%' OR lname LIKE '%{$searchData}%' OR gender LIKE '%{$searchData}%' OR bday LIKE '%{$searchData}%' OR age LIKE '%{$searchData}%' OR citizenship LIKE '%{$searchData}%' OR occupation LIKE '%{$searchData}%' OR status LIKE '%{$searchData}%' OR purok LIKE '%{$searchData}%' OR resAddress LIKE '%{$searchData}%' OR perAddress LIKE '%{$searchData}%' OR email LIKE '%{$searchData}%' OR telNum LIKE '%{$searchData}%' OR cpNum LIKE '%{$searchData}%'");
foreach ($query->result() as $searchResult) {
echo json_encode($searchResult);
}
} else {
echo '';
}
}
}
这一切都完全有效。但我想用标记在指定位置显示这些数据(使用数据的纬度和经度)。
我的问题是,当我使用以下内容更改脚本中的var myLatLong = new google.maps.LatLng(7.289600, 125.678066);
时:var myLatLong = new google.maps.LatLng(searchMapDataResult['latlong']);
其中该值来自数据的纬度和经度,它不会显示标记或地图。它显示带有控制器的灰色面板。我很困惑为什么它会显示这个var myLatLong = new google.maps.LatLng(7.289600,125.678066)
的标记,但是var myLatLong = new google.maps.LatLng(searchMapDataResult['latlong'])
的{{1}}的值与searchMapDataResult['latlong']
完全相同?
我知道这个问题很广泛,帖子太长了,但我希望你们都能帮助我。任何想法和建议都是天堂般的赞赏,提前谢谢:)
答案 0 :(得分:1)
问题是google.maps.LatLng期待两个数字并且你从数据库传递一个字符串(假设searchMapDataResult ['latlong']返回一个逗号分隔的字符串)。所以你需要
像这样:
var latLngArray = searchMapDataResult['latlong'].split(',');
var latitude = parseFloat(latLngArray[0]);
var longitude = parseFloat(latLngArray[1]);
var myLatLong = new google.maps.LatLng(latitude,longitude );