-2

ページがロードされると、すべてのポリラインがマップ上に自動ロードされます。非表示にする必要があります。チェックボックスをクリックすると、マップに表示されます。どうすればできますか?ポリラインにはカテゴリがあります..レーヨンのように..チェックボックスのカテゴリでレーヨンと呼んでいます..

PS私のコードで私の英語で申し訳ありません:

    function getline() {
       var mpenc = new google.maps.InfoWindow();

 function pinfo(poly, html) {


      google.maps.event.addListener(poly,"mouseover",function(){ poly.setOptions({
 strokeColor:'#FFFFFF', strokeOpacity: .8});});

      google.maps.event.addListener(poly,"mouseout",function(){ 
poly.setOptions({strokeColor:colorr});});


     google.maps.event.addListener(poly,'click', function(event) {
    mpenc.setContent(html);
    mpenc.setPosition(event.latLng);
    mpenc.open(map);
  });

}      
 alert('Loading Lines.. Please wait 10 sec.');  
downloadUrl("all.php", function(doc) {
      alert('Lines loaded..');  

      var g = google.maps; 
        var xmlDoc = xmlParse(doc);         bounds = new google.maps.LatLngBounds(); 
      // ========= Now process the polylines ===========
      var lines = xmlDoc.documentElement.getElementsByTagName("line");

      // read each line
      for (var a = 0; a < lines.length; a++) {
        // get any line attributes
       var colour = lines[a].getAttribute("colour");
        var width  = parseFloat(lines[a].getAttribute("width"));
        var diameter = lines[a].getAttribute("diameter");
        var project = lines[a].getAttribute("projectid");       var type = lines[a].getAttribute("type");
        var contract = lines[a].getAttribute("contract");             var cr = lines[a].getAttribute("contractor"); if (cr) {cr1 = "  " + cr + " ";} else { cr1 = "None";}
        var comp = lines[a].getAttribute("complated");
        var id = lines[a].getAttribute("id_line");
        var html = "<b>Contractor:</b> " + cr1 + " </a> <br/> <b> Contract: </b>" + contract + " <br/><b>Line Segment:</b> " + id + " <br/><b>Project: </b>" + project +"<br/>  <b>Diameter: </b>" + diameter + " <br/> <b>Completed: </b>" + comp + "% <hr><br/><a class=\"inline-link-1\" HREF=\"javascript:void(0)\"onclick=\"window.open('cdatal.php?id="+ id +"','cdatal','height=300, width=460,scrollbars=no')\">Change completed</a> <a class=\"inline-link-1\" HREF=\"javascript:void(0)\"onclick=\"window.open('dedit.php?id="+ id +"','cdata','height=300, width=350,scrollbars=no')\">Design data</a>" ;
        // read each point on that line
        var points = lines[a].getElementsByTagName("point");
        var pts = [];
        var length = 0;
        var point = null;
        for (var i = 0; i < points.length; i++) {
           pts[i] = new g.LatLng(parseFloat(points[i].getAttribute("lng")),
                                parseFloat(points[i].getAttribute("lat")));
           if (i > 0) {
             length += pts[i-1].distanceFrom(pts[i]);
             if (isNaN(length)) { alert("["+i+"] length="+length+" segment="+pts[i-1].distanceFrom(pts[i])) };
           }
           bounds.extend(pts[i]);
           point = pts[parseInt(i/2)];
        }
        // length *= 0.000621371192; // miles/meter 


  if (comp < 1) { 
 colorr = '#FA0505' }

 if (comp > 0 && comp < 25 ) { 
 colorr = '#FFA640' }

 if (comp > 24 && comp < 50) { 
 colorr = '#FFFD91' }

 if (comp > 49 && comp < 75) { 
 colorr = '#E8E400' }

 if (comp > 74 && comp < 100) { 
 colorr = '#BFFFAD' }

 if (comp == 100) { 
 colorr = '#0F8500' }
    if(type == 'dl') {en = '1'}     if(type == 'ml') {en = '3'}     if(type == 'tl') {en = '5'}

        var poly = new g.Polyline({
                          map:map,
                          path:pts,
                          strokeColor:colorr,
                          strokeWeight:en,
                          clickable: true
                          });



   pinfo(poly,html);



 }
      map.fitBounds(bounds);

    });


}



 <li><input type="checkbox" id="value1" value="wsn/qabala.php" onclick="boxclick(this.value,'qabala','value1')" /> Qabala</li>
  <li><input type="checkbox" id="value2" value="wsn/ismailli.php"  onclick="boxclick(this.value,'ismailli','value2')" /> Ismayilli</li>
  <li><input type="checkbox" id="value3"  value="wsn/agshu.php"   onclick="boxclick(this.value,'value3')" /> Aghsu</li> ....

および xml データ:

http://nn-gis.com/map/all.php
4

1 に答える 1