none
Toggeling of Poly lines onclick of pushpin

    Question

  • Hi ,

    I want to show poly lines on click of pushpin and again next click it should hide the poly lines

    Currently i am showing Poly lines on clicking of pushpin but on next click on same push pin i want to hide poly lines??

    Please help me how to do???

    Thanks

    Vinayak

    Wednesday, July 10, 2013 1:11 PM

Answers

  • Simply add a toggle like logic to the event handler of your pushpin. Here is a simple example where I'm simply showing alerts in place of showing/hiding the polyline.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
       <head>
          <title></title>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
          <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
          <script type="text/javascript">
          var map;
    	  
    	  function getMap()
          {
            map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
    			credentials: 'Your_Bing_Map_Key'
    		});
    
            var pin= new Microsoft.Maps.Pushpin(map.getCenter()); 
    		
    		//Add a state property to keep track of the toggled state
    		pin.ToggleState = false;
    		
            Microsoft.Maps.Events.addHandler(pin, 'click', displayEventInfo);  
            map.entities.push(pin); 
          }
          
          displayEventInfo = function (e) {
    		if(!e.target.ToggleState){
    			alert('Show Polyline');
    			e.target.ToggleState = true;
    		}else{
    			alert('Hide Polyline');
    			e.target.ToggleState = false;
    		}
          }
          </script>
       </head>
       <body onload="getMap();">
          <div id='myMap' style="; width:800px; height:600px;"></div>
       </body>
    </html>
    


    http://rbrundritt.wordpress.com

    Monday, July 15, 2013 10:18 AM
    Owner