Xml 当选择一个位置时，谷歌地图会在地图中心显示标记

我正在把谷歌地图添加到我的一个网站上。 我的下拉列表中有许多州的名字。当我让他们点击时，它将地图平移到正确的位置。但是标记图标不在地图的中心。我希望当我选择一个位置时，所选位置应该位于地图的中心。 我对select位置的标记如下

<div class="state">
    <label>Please Select State</label> <br />
    <select id="selectState" class="statelist" onchange="changeZoomCenter(this.value,'12');">
    </select>
  </div>

function changeicons(z){   }
  var customIcons = {
    restaurant: {
      icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569',
      shadow: 'marker/mm_20_shadow.png'
    },
  };
  var map;
  var directionsDisplay;
  var directionsService = new google.maps.DirectionsService();
  var bounds = new google.maps.LatLngBounds();
  var markerArray = [];
  function loadMap() {
    map = new google.maps.Map(document.getElementById("map-canvas"), {
    center: new google.maps.LatLng(20.0000, 78.0000),
    zoom: 5,
    mapTypeId: 'roadmap'
  });
    google.maps.event.addListener(map, 'zoom_changed', function() {
      var zoomLevel = map.getZoom();
      changeicons(zoomLevel);
    }); 
    var infoWindow = new google.maps.InfoWindow;
      // Change this depending on the name of your PHP file
      downloadUrl("googlemap/xml.php", function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
         // var name = markers[i].getAttribute("name");
          var address = markers[i].getAttribute("address");
          var storeid = markers[i].getAttribute("store_id");
          //var type = markers[i].getAttribute("type");
          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
          var html = "<b>" + name + "</b> <br/>" + address;
          var icon = customIcons['restaurant'] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            //shadow: icon.shadow,
      animation: google.maps.Animation.DROP
          });
      markerArray.push(marker);
      bounds.extend(marker.position);
          bindInfoWindow(marker, map, infoWindow, html, storeid);
        }
    map.fitBounds(bounds);

      });

    }



    function bindInfoWindow(marker, map, infoWindow, html, storeid) {
      google.maps.event.addListener(marker, 'click', function() {
        var request = window.ActiveXObject ?
        new ActiveXObject('Microsoft.XMLHTTP') :
        new XMLHttpRequest;
        request.onreadystatechange = function() {
        if (request.readyState == 4) {
           infoWindow.setContent(request.responseText+html);
               infoWindow.open(map, marker);
        }
        };

        request.open('GET', 'php/infobox.php?id='+storeid, true);
        request.send(null);

      });
    }

    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);
    }





  function changeZoomCenter(ll,z){
        var geo = new google.maps.Geocoder;
        geo.geocode({'address':ll},function(results, status){
          if (status == google.maps.GeocoderStatus.OK) {              
            var myLatLng = results[0].geometry.location;
             map.panTo(myLatLng);

             z=parseInt(z);
             map.setZoom(z);
          } else {
            alert("Geocode was not successful for the following reason: " + status);
          }
        });

  }


    function road(s,e) {
  var start = s;
  var end = e;
  directionsDisplay = new google.maps.DirectionsRenderer();
  directionsDisplay.setMap(map);
  var request = {
      origin:start,
      destination:end,
      travelMode: google.maps.DirectionsTravelMode.DRIVING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });

}

请选择状态

谷歌地图的代码是这样的

<div class="state">
    <label>Please Select State</label> <br />
    <select id="selectState" class="statelist" onchange="changeZoomCenter(this.value,'12');">
    </select>
  </div>

function changeicons(z){   }
  var customIcons = {
    restaurant: {
      icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569',
      shadow: 'marker/mm_20_shadow.png'
    },
  };
  var map;
  var directionsDisplay;
  var directionsService = new google.maps.DirectionsService();
  var bounds = new google.maps.LatLngBounds();
  var markerArray = [];
  function loadMap() {
    map = new google.maps.Map(document.getElementById("map-canvas"), {
    center: new google.maps.LatLng(20.0000, 78.0000),
    zoom: 5,
    mapTypeId: 'roadmap'
  });
    google.maps.event.addListener(map, 'zoom_changed', function() {
      var zoomLevel = map.getZoom();
      changeicons(zoomLevel);
    }); 
    var infoWindow = new google.maps.InfoWindow;
      // Change this depending on the name of your PHP file
      downloadUrl("googlemap/xml.php", function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
         // var name = markers[i].getAttribute("name");
          var address = markers[i].getAttribute("address");
          var storeid = markers[i].getAttribute("store_id");
          //var type = markers[i].getAttribute("type");
          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
          var html = "<b>" + name + "</b> <br/>" + address;
          var icon = customIcons['restaurant'] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            //shadow: icon.shadow,
      animation: google.maps.Animation.DROP
          });
      markerArray.push(marker);
      bounds.extend(marker.position);
          bindInfoWindow(marker, map, infoWindow, html, storeid);
        }
    map.fitBounds(bounds);

      });

    }



    function bindInfoWindow(marker, map, infoWindow, html, storeid) {
      google.maps.event.addListener(marker, 'click', function() {
        var request = window.ActiveXObject ?
        new ActiveXObject('Microsoft.XMLHTTP') :
        new XMLHttpRequest;
        request.onreadystatechange = function() {
        if (request.readyState == 4) {
           infoWindow.setContent(request.responseText+html);
               infoWindow.open(map, marker);
        }
        };

        request.open('GET', 'php/infobox.php?id='+storeid, true);
        request.send(null);

      });
    }

    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);
    }





  function changeZoomCenter(ll,z){
        var geo = new google.maps.Geocoder;
        geo.geocode({'address':ll},function(results, status){
          if (status == google.maps.GeocoderStatus.OK) {              
            var myLatLng = results[0].geometry.location;
             map.panTo(myLatLng);

             z=parseInt(z);
             map.setZoom(z);
          } else {
            alert("Geocode was not successful for the following reason: " + status);
          }
        });

  }


    function road(s,e) {
  var start = s;
  var end = e;
  directionsDisplay = new google.maps.DirectionsRenderer();
  directionsDisplay.setMap(map);
  var request = {
      origin:start,
      destination:end,
      travelMode: google.maps.DirectionsTravelMode.DRIVING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });

}

函数更改图标（z）{
var customIcons={
餐厅：{
图标：'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569'，
阴影：“marker/mm_20_shadow.png”
},
};
var映射；
var方向显示；
var directionsService=new google.maps.directionsService（）；
var bounds=new google.maps.LatLngBounds（）；
var-markerary=[]；
函数loadMap（）{
map=new google.maps.map（document.getElementById（“地图画布”）{
中心：新google.maps.LatLng（20.0000,78.0000），
缩放：5，
mapTypeId:“路线图”
});
google.maps.event.addListener（映射'zoom_changed'，函数（）{
var zoomLevel=map.getZoom（）；
更改图标（缩放级别）；
}); 
var infoWindow=new google.maps.infoWindow；
//根据PHP文件的名称更改此选项
下载URL（“googlemap/xml.php”，函数（数据）{
var xml=data.responseXML；
var markers=xml.documentElement.getElementsByTagName（“标记”）；
对于（var i=0；i“+地址；
var icon=customIcons['restaurant']|{}；
var marker=new google.maps.marker({
地图：地图，
位置:点,，
icon:icon.icon，
//shadow:icon.shadow，
动画：google.maps.animation.DROP
});
markerArray.push（标记器）；
扩展（标记位置）；
bindInfoWindow（标记、地图、infoWindow、html、storeid）；
}
映射边界（bounds）；
});
}
函数bindInfoWindow（标记、地图、infoWindow、html、storeid）{
google.maps.event.addListener（标记'click'，函数（）{
var请求=window.ActiveXObject？
新的ActiveXObject（'Microsoft.XMLHTTP'）：
新的XMLHttpRequest；
request.onreadystatechange=函数（）{
if（request.readyState==4）{
setContent（request.responseText+html）；
信息窗口。打开（地图、标记）；
}
};
open（'GET'，'php/infobox.php？id='+storeid，true）；
请求发送（空）；
});
}
函数下载url（url，回调）{
var请求=window.ActiveXObject？
新的ActiveXObject（'Microsoft.XMLHTTP'）：
新的XMLHttpRequest；
request.onreadystatechange=函数（）{
if（request.readyState==4）{
request.onreadystatechange=doNothing；
回调（请求、请求、状态）；
}
};
打开（'GET'，url，true）；
请求发送（空）；
}
函数更改ZoomCenter（ll，z）{
var geo=new google.maps.Geocoder；
geo.geocode（{'address'：ll}，函数（结果，状态）{
如果（status==google.maps.GeocoderStatus.OK）{
var mylatng=results[0]。geometry.location；
panTo地图（Mylatng）；
z=parseInt（z）；
map.setZoom（z）；
}否则{
警报（“地理编码因以下原因未成功：“+状态”）；
}
});
}
多功能道（南、东）{
var start=s；
var-end=e；
directionsDisplay=new google.maps.DirectionsRenderer（）；
方向显示.setMap（地图）；
var请求={
来源：start，
目的地:完，
travelMode:google.maps.Directions travelMode.DRIVING
};
路由（请求、功能（响应、状态）{
if（status==google.maps.directionstatus.OK）{
方向显示。设置方向（响应）；
}
});
}

---

那么，有人能告诉我如何在页面中心制作标记（图标）

如何填充#selectState？目前，我看不到下拉列表和标记之间有任何关系。是的，我使用了另一个jquery ajax函数来填充selecte国家的状态。。但是如果没有这个，我可以平移到谷歌地图位置，但它不能回答我的问题，下拉列表和标记之间的关系在哪里（当你使用下拉列表时，必须有任何一个标记位置居中）