脚本json文件在地图上创建标记和显示标记

时间:2012-04-13 20:22:18

标签: json markers

抱歉 - >但我是K.O.用它

我只想让我的cooord.json文件(来自php / mysql请求)在javascript的参数中进行创建标记并在地图上显示

  • 首先是我的HTML代码
  • 两个myjson文件

由于 Desbutes

    <!DOCTYPE html>
<html>
<head>
<title>Développez avec les API Google Maps</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<style type="text/css">
    html {
    height: 100%;
    }
    body {
    height: 100%;
    margin: 0px;
    padding: 0px;
    }
    #map_canvas {
    height: 100%;
    }
</style>
        <!-- http://www.fsupoitiers.fr/mouvement/coorrdon.json -->
   <script type="text/javascript"
        src="http://maps.google.com/maps/api/js?sensor=false" ></script>
<script type="text/javascript">
function initialize() {
    var latlng = new google.maps.LatLng(46.587953, 0.34611);
    var myOptions = {
    zoom: 11,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    };
 //var url = 'http://www.fsupoitiers.fr/mouvement/coorrdon.json';


  $.getJSON('http://www.fsupoitiers.fr/mouvement/coorrdon.json', function(data) {

    map= new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var bounds=new google.maps.LatLngBounds();
    infowindow = new google.maps.InfoWindow({
                    content: 'ec_ville'
                  });

    $.each(data, function(index, c) {   

          var latlng = new google.maps.LatLng(c.fields['lat'],c.fields['lng']); 

          var marker = new google.maps.Marker({
                          map: map,
                          position: latlng,
                          title:'ec_nom:'+c.ec_nom
                      });
          bounds.extend(latlng);

          google.maps.event.addListener(marker, 'click', function() {
              infowindow.close();
              infowindow.setContent('ec_nom:'+c.ec_nom);
              infowindow.open(map, marker);
          });


    });//close each
    map.fitBounds(bounds);  
    });//close getjson

    }//close initialize
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 100%; height: 100%;"></div>


</body>
</html>

现在我的coord.json文件

{"lat":"46.8529510","lng":"0.5433920","ec_nom":"ANTRAN","ec_type":"ECOLE       ELEM","ec_adresse":"PLACE DE L EGLISE","ec_ville":"ANTRAN","ec_cp":"86100"}

如果你读到这里,那么你已经重新编写了代码......再次感谢

0 个答案:

没有答案