Javascript 隐藏信息窗口标记并动态显示
我正在使用这个插件cordova插件googlemaps 尽管问题并不局限于此 I包含名称、地址和latlong的结果数组。 我用for循环将标记放在地图上。 单击标记，信息窗口打开 但是我想要的是从单击列表视图中的项目打开特定的标记信息窗口 我发布了一些代码来获得微妙的想法Javascript 隐藏信息窗口标记并动态显示,javascript,cordova,google-maps,Javascript,Cordova,Google Maps,我正在使用这个插件cordova插件googlemaps 尽管问题并不局限于此 I包含名称、地址和latlong的结果数组。 我用for循环将标记放在地图上。 单击标记，信息窗口打开 但是我想要的是从单击列表视图中的项目打开特定的标记信息窗口 我发布了一些代码来获得微妙的想法 for (; i < noOfData; ++i) { (function(n) { setTimeout(function() {
for (; i < noOfData; ++i) {
(function(n) {
setTimeout(function() {
var position = new plugin.google.maps.LatLng(resultList[n].latitude, resultList[n].longitude);
markers.push(position);
$rootScope.map.addMarker({
'position': position,
'title': resultList[n].name,
'index': n,
'snippet': resultList[n].address,
"styles": {
'text-align': 'center',
'font-style': 'italic',
'color': 'red'
},
disableAutoPan: false
}, function(marker) {
$scope.listResults = resultList;
if ((+n + 1) == noOfData) {
var latLngBounds = new plugin.google.maps.LatLngBounds(markers);
console.log(hashCodeArrayOfMarkers.toString());
$rootScope.map.animateCamera({
'target': latLngBounds,
'zoom': 15,
'duration': 1000 // 1 seconds
});
}
marker.addEventListener(plugin.google.maps.event.MARKER_CLICK, function() {
var indexOfMarkerClicked = marker.get("index");
marker.showInfoWindow();
$scope.clickList(indexOfMarkerClicked);
marker.showInfoWindow();
marker.getPosition(function(latLng) {
$rootScope.map.animateCamera({
'target': latLng,
// 'zoom': 16,
'duration': 400
});
});
});
});
}, 0 + (0 * n));
})(i);
}
{
（功能（n）{
setTimeout（函数（）{
var position=new plugin.google.maps.LatLng（结果列表[n]。纬度，结果列表[n]。经度）；
推（位）；
$rootScope.map.addMarker({
“位置”：位置，
“标题”：结果列表[n]。名称，
“索引”：n，
“代码段”：结果列表[n]。地址，
“风格”：{
“文本对齐”：“居中”，
“字体样式”：“斜体”，
“颜色”：“红色”
},
disableAutoPan:错误
}，功能（标记）{
$scope.listResults=resultList；
如果（（+n+1）=noOfData）{
var latLngBounds=new plugin.google.maps.latLngBounds（markers）；
log（hashCodeArrayOfMarkers.toString（））；
$rootScope.map.animateCamera({
“目标”：latLngBounds，
“缩放”：15，
“持续时间”：1000//1秒
});
}
marker.addEventListener（plugin.google.maps.event.marker_单击，函数（）{
var indexOfMarkerClicked=marker.get（“索引”）；
marker.showInfoWindow（）；
$scope.clickList（indexofmarker单击）；
marker.showInfoWindow（）；
标记器。获取位置（功能（latLng）{
$rootScope.map.animateCamera({
“目标”：latLng，
//“缩放”：16，
“持续时间”：400
});
});
});
});
}，0+（0*n））；
})（i） )；
}
我想从项目点击列表中得到相同的结果。
我可以将相机移动到标记上，因为我有latLng，但我想打开latLng上相同标记的信息窗口。
请帮助我。科尔多瓦动态标记
Dynamic Marker in Cordova
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="cordova.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
var map;
var data = [];
var lat,long,snippet,title;
document.addEventListener("deviceready", function() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
console.log("this.responseText==="+this.responseText);
var parse = JSON.parse(this.responseText);
var invv = parse.info;
console.log("invv=="+invv);
var count = invv.length;
console.log("count=="+count);
var i;
for(i = 0 ;i < count ; i++){
lat = invv[i].lat;
long = invv[i].long;
snippet = invv[i].snippet;
title = invv[i].title;
console.log("title==="+title);
data.push({
"title" : title,
"position": new plugin.google.maps.LatLng(lat,long),
});
}
console.log("data one==="+JSON.stringify(data));
sw(JSON.stringify(data));
}
};
xmlhttp.open("GET", "http://192.168.1.100/tuts_rest/latlong.php", true);
xmlhttp.send();
console.log("data two==="+JSON.stringify(data));
var mapDiv = document.getElementById("map_canvas");
const GOOGLE = new plugin.google.maps.LatLng(-33.890542, 151.274856);
var map = plugin.google.maps.Map.getMap(mapDiv, {
'camera': {
'latLng': GOOGLE,
'zoom': 17
}
});
function sw(a){
map.addEventListener(plugin.google.maps.event.MAP_READY, function() {
console.log("data==="+a);
var obj = JSON.parse(a);
console.log("obj==="+obj);
var nn = obj.length;
console.log("nn==="+nn);
for(var i = 0; i < obj.length;i++){
addMarkers(obj, function(markers) {
console.log("a==="+obj);
console.log("hellooooo");
console.log(markers[markers.length - 1]);
markers[markers.length - 1].showInfoWindow();
});
}
function addMarkers(data, callback) {
var markers = [];
function onMarkerAdded(marker) {
console.log("marker==="+JSON.stringify(markers));
markers.push(marker);
if (markers.length === data.length) {
callback(markers);
}
}
data.forEach(function(markerOptions) {
map.addMarker(markerOptions, onMarkerAdded);
});
}
});
}
});
</script>
</head>
<body>
<h3>PhoneGap-GoogleMaps-Plugin</h3>
<div style="width:100%;height:400px" id="map_canvas"></div>
<button id="button">Full Screen</button>
</body>
</html>
JSON Response
{"status":1,"info":[{"lat":"-33.890542","long":"151.274856","snippet":"Hello"},{"lat":"-33.923036","long":" 151.259052","snippet":"Hello"}]}
PHP Code
<?php
// Include confi.php
include_once('config.php');
$qur = mysql_query("select * from `latlong`");
$result =array();
while($r = mysql_fetch_array($qur)){
extract($r);
$result[] = array("lat" => $lat, "long" => $long, 'snippet' => $snippet ,'title' => $title);
}
$json = array("status" => 1, "info" => $result);
@mysql_close($conn);
/* Output header */
header('Content-type: application/json');
echo json_encode($json);
?>
Config.PHP
<?php
$conn = mysql_connect("localhost", "root", "");
mysql_select_db('tuts_rest', $conn);
?>
var映射；
var数据=[]；
变量lat，long，snippet，title；
document.addEventListener（“deviceready”，函数（）{
var xmlhttp=new XMLHttpRequest（）；
xmlhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
log（“this.responseText==”+this.responseText）；
var parse=JSON.parse（this.responseText）；
var invv=parse.info；
console.log（“invv==”+invv）；
var计数=invv.length；
log（“计数=”+计数）；
var i；
对于（i=0；i