Javascript为每个记录创建一个计数
我正在使用GoogleMapsJavaScript创建地图。我需要得到ben创建的每个标记的计数,这个计数被放在一个DIV中。 scipt收集计数,但显示每个标记的计数。 例如,如果查询返回了三个标记,那么3将被回显三次。如果创建了43个标记,则数字43将在DIV中回显43次Javascript为每个记录创建一个计数,javascript,google-maps,Javascript,Google Maps,我正在使用GoogleMapsJavaScript创建地图。我需要得到ben创建的每个标记的计数,这个计数被放在一个DIV中。 scipt收集计数,但显示每个标记的计数。 例如,如果查询返回了三个标记,那么3将被回显三次。如果创建了43个标记,则数字43将在DIV中回显43次 var MarkerCount; var count = markerNodes.length; var markercountEntry = createMarkerCount(count); MarkerCount.a
var MarkerCount;
var count = markerNodes.length;
var markercountEntry = createMarkerCount(count);
MarkerCount.appendChild(markercountEntry);
function createMarkerCount(count) {
var div = document.createElement('div');
var html = "<br/>" + count;
div.innerHTML = html;
div.style.marginBottom = '5px';
return div;
}
var MarkerCount;
变量计数=markerNodes.length;
var markercountEntry=createMarkerCount(计数);
MarkerCount.appendChild(markercountEntry);
函数createMarkerCount(计数){
var div=document.createElement('div');
var html=“
”+计数;
div.innerHTML=html;
div.style.marginBottom='5px';
返回div;
}
感谢任何帮助我理解我为什么会有这种行为的帮助。预期的行为是一次写入结果,而不是根据标记的数量写入x次
编辑------
以下是完整的代码:
var icon = new google.maps.MarkerImage("./images/plum_flag.png",
new google.maps.Size(35, 52), new google.maps.Point(0, 0),
new google.maps.Point(0, 52));
var map;
var markers = [];
var infoWindow;
var sidebar;
var MarkerCount;
function load() {
map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(36.1611, -116.4775),
zoom: 6,
mapTypeId: 'roadmap',
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DEFAULT}
});
infoWindow = new google.maps.InfoWindow();
sidebar = document.getElementById("sidebar");
}
function formatPhone(telephone) {
return "("+telephone.substring(0,3)+")"+telephone.substring(3,6)+"-"+telephone.substring(6,11);
}
function searchLocations() {
var address = document.getElementById("addressInput").value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode({address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
searchLocationsNear(results[0].geometry.location);
} else {
alert(address + ' not found');
}
});
}
function clearLocations() {
infoWindow.close();
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
markers.length = 0;
sidebar.innerHTML = "";
map.setCenter(new google.maps.LatLng(36.1611, -116.4775), 6);
var icon=new google.maps.MarkerImage(“./images/plum_flag.png”,
新的google.maps.Size(35,52),新的google.maps.Point(0,0),
新的google.maps.Point(0,52));
var映射;
var标记=[];
var信息窗口;
var边栏;
var-MarkerCount;
函数加载(){
map=new google.maps.map(document.getElementById(“map”){
中心:新google.maps.LatLng(36.1611,-116.4775),
缩放:6,
mapTypeId:“路线图”,
mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DEFAULT}
});
infoWindow=new google.maps.infoWindow();
边栏=document.getElementById(“边栏”);
}
功能格式化电话(电话){
返回“(“+电话子串(0,3)+”)电话子串(3,6)+”-“+电话子串(6,11);
}
函数searchLocations(){
var address=document.getElementById(“addressInput”).value;
var geocoder=new google.maps.geocoder();
geocoder.geocode({address:address},函数(结果,状态){
if(status==google.maps.GeocoderStatus.OK){
searchLocationsNear(结果[0]。几何体。位置);
}否则{
警报(地址+‘未找到’);
}
});
}
函数clearLocations(){
infoWindow.close();
对于(var i=0;i
}
函数搜索位置近(中){
clearLocations();
var state=document.getElementById('stateSelect').value;
var facility=document.getElementById('facility')。值;
var searchUrl='sql_to_xml.asp?facility='+facility+'&state='+state;
下载URL(搜索URL,函数(数据){
var xml=parseXml(数据);
var markerNodes=xml.documentElement.getElementsByTagName(“标记”);
var bounds=new google.maps.LatLngBounds();
var sidebar=document.getElementById('sidebar');
sidebar.innerHTML='';
if(markerNodes.length==0){
sidebar.innerHTML='未找到任何结果';
地图设置中心(新的google.maps.LatLng(36.1611,-116.4775),6);
返回;
}
var MarkerCount=document.getElementById('MarkerCount');
MarkerCount.innerHTML='';
if(markerNodes.length==0){
MarkerCount.innerHTML='未找到任何结果';
地图设置中心(新的google.maps.LatLng(36.1611,-116.4775),6);
返回;
}
对于(变量i=0;i 对于(i=0;i不要将createMarkerCount放入循环中
因此,改变:
for (var i = 0; i < markerNodes.length; i++) {
var count = markerNodes.length;
for (i=0;i<count;i++)
{
var markercountEntry = createMarkerCount(i);
MarkerCount.appendChild(markercountEntry);
}
var name = markerNodes[i].getAttribute("name");
var address = markerNodes[i].getAttribute("address");
var city = markerNodes[i].getAttribute("city");
var state = markerNodes[i].getAttribute("state");
var zipcode = markerNodes[i].getAttribute("zipcode");
var telephone = markerNodes[i].getAttribute("telephone");
var images = markerNodes[i].getAttribute("images");
var url = markerNodes[i].getAttribute("url");
var latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")),
parseFloat(markerNodes[i].getAttribute("lng")));
var marker = createMarker(latlng, name, address, city, state, zipcode, telephone, images, url);
bounds.extend(latlng);
var sidebarEntry = createSidebarEntry(marker, name, address, city, state, zipcode, telephone, images, url);
sidebar.appendChild(sidebarEntry);
//var markercountEntry = createMarkerCount(count);
//MarkerCount.appendChild(markercountEntry);
}
map.fitBounds(bounds);
});
}
for(变量i=0;i 对于(i=0;它的代码本身应该可以正常工作。您能发布完整的代码吗?嗨,谢里夫,当我实现该建议时,DIV上的标记计数显示为0 1 2(如果有三个标记)是的,正确!如果您想要1 2 3…更改for(i=0;iSherif,很抱歉我搞混了。我想数一数标记的总数,并在DIV中显示总数。因此,如果我数到3个标记,我想显示数字3,而不是显示0,1,2或3,3,3…。谢谢你查看我的帖子!谢里夫,你就是那个人!谢谢你向我解释这一点,谢谢你的帮助抽出时间来帮助我!
for (var i = 0; i < markerNodes.length; i++) {
var count = markerNodes.length;
for (i=0;i<count;i++)
{
var markercountEntry = createMarkerCount(i);
MarkerCount.appendChild(markercountEntry);
}
var name = markerNodes[i].getAttribute("name");
var address = markerNodes[i].getAttribute("address");
var city = markerNodes[i].getAttribute("city");
var state = markerNodes[i].getAttribute("state");
var zipcode = markerNodes[i].getAttribute("zipcode");
var telephone = markerNodes[i].getAttribute("telephone");
var images = markerNodes[i].getAttribute("images");
var url = markerNodes[i].getAttribute("url");
var latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")),
parseFloat(markerNodes[i].getAttribute("lng")));
var marker = createMarker(latlng, name, address, city, state, zipcode, telephone, images, url);
bounds.extend(latlng);
var sidebarEntry = createSidebarEntry(marker, name, address, city, state, zipcode, telephone, images, url);
sidebar.appendChild(sidebarEntry);
//var markercountEntry = createMarkerCount(count);
//MarkerCount.appendChild(markercountEntry);
}
map.fitBounds(bounds);
});
}
var markercountEntry = createMarkerCount(markerNodes.length);
MarkerCount.appendChild(markercountEntry);
for (var i = 0; i < markerNodes.length; i++) {
var name = markerNodes[i].getAttribute("name");
var address = markerNodes[i].getAttribute("address");
var city = markerNodes[i].getAttribute("city");
var state = markerNodes[i].getAttribute("state");
var zipcode = markerNodes[i].getAttribute("zipcode");
var telephone = markerNodes[i].getAttribute("telephone");
var images = markerNodes[i].getAttribute("images");
var url = markerNodes[i].getAttribute("url");
var latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")),
parseFloat(markerNodes[i].getAttribute("lng")));
var marker = createMarker(latlng, name, address, city, state, zipcode, telephone, images, url);
bounds.extend(latlng);
var sidebarEntry = createSidebarEntry(marker, name, address, city, state, zipcode, telephone, images, url);
sidebar.appendChild(sidebarEntry);
//var markercountEntry = createMarkerCount(count);
//MarkerCount.appendChild(markercountEntry);
}
map.fitBounds(bounds);
});
}