在Biostall-google-maps-V3 API库中显示带有latlong json数据的标记问题
Displaying marker with latlong json data in Biostall-google-maps-V3 API Library issue
我有一个简单的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'])
,其中searchMapDataResult['latlong']
的值是完全相同的?
问题是google.maps.LatLng期望两个数字,您正在从数据库传递一个字符串(假设searchMapDataResult['latlong']返回逗号分隔的字符串)。所以你需要
- 分割经纬度
- 转换成数字
- 生成google.maps.LatLng
:
var latLngArray = searchMapDataResult['latlong'].split(',');
var latitude = parseFloat(latLngArray[0]);
var longitude = parseFloat(latLngArray[1]);
var myLatLong = new google.maps.LatLng(latitude,longitude );
相关文章:
- 无法使用变量访问数据 JSON
- 使用 ng-repeat解析不均匀数据/ json对象
- 在没有jsonp的情况下从另一个域获取数据(json格式)
- 如何获取带参数的数据json
- 如何在android中显示实时雅虎金融股票数据..json格式如下所示
- 使用 JavaScript 将数据 json 显示到网页中
- 高位图表来源于API数据(JSON)
- 使用动态数据json初始化同位素
- Django:将数据JSON从视图传递给javascript
- 存储配置数据 (json)
- 未捕获的SyntaxError:意外的标识符图像数据json
- 接收数据json/jquery
- Jquery数据表数据json
- 不能在cakephp中使用数组数据json
- 在不锁定浏览器的情况下,将大数据JSON从REST请求反序列化为对象
- 如何读取数据JSON格式数组的字符串数据
- 我有一个流星应用程序,需要从/public/_assets/results/mmresults读取数据.Json文件,在
- 数据json不显示在html
- 使用2个下拉列表创建2个并排的表行来比较数据- JSON
- 需要将复杂的json对象转换为合适的angularjs UI树数据json结构