I have a set of pushpins whos ID range from 0 to 4. So I was wondering if there was a way to assign the code listed below to a single pushpin (by ID ) Thanks
function PinClick(id)
{
document.getElementById('txt1').value = ("ID 0");
document.getElementById('txt1').value = ("ID 1");
document.getElementById('txt1').value = ("ID 2");
document.getElementById('txt1').value = ("ID 3");
document.getElementById('txt1').value = ("ID 4");
}
Assign to Pushpin
cpurick
Yeah, sorry, I meant "switch/case". So it would look something like this (note: I haven't compiled/tested the following; it is pseudo-code):
function PinClick(id)
{
switch (id)
{
case 0:
document.getElementById('txt1').value = ("ID 0");
break;
case 1:
document.getElementById('txt1').value = ("ID 1");
break;
case 2:
document.getElementById('txt1').value = ("ID 2");
break;
case 3:
document.getElementById('txt1').value = ("ID 3");
break;
case 4:
document.getElementById('txt1').value = ("ID 4");
break;
}
}
hallscreations
I'm not sure I understand the question. Are you looking to assign the value of the txt1 object based on whichever pushpin is clicked or hovered over If so, you need to do something like a select/case routine in the event handler. I think that would be fastest.
Juan Carlos Trimiño
johnof
Yeah. I copied your code when showing you my suggestion, and managed to copy a typo
.
Each of these lines:
document.getElementById('txt1').value = ("ID 4");
should be (for each line, not just this one, of course):
document.getElementById('txt1').value = "ID 4";
keacegll
What do you mean by 'select/case routine in the event handler' Can i see an example of this Thanks
MLansdaal
I know you said your code might not be completly correct but if I show you the code below can you see mady why this is not working for me Thanks!
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://dev.virtualearth.net/mapcontrol/v3/mapcontrol.js"></script>
<script>
var map = null;
var pins = new Array(null,null);
var clickCounts = new Array(0,0);
function GetMap()
{
map = new VEMap('myMap');
map.LoadMap(new VELatLong(45.75108, -87.56652), 8, 'r', false);
AddPin();
}
function PinHover(x, y, title, details)
{
var ID = event.srcElement.parentNode.id;
pin = pins[ID];
var obj = pin.GetContent();
var e=document.getElementById(ID+"_"+map.GUID);
if(e!=null&&e!="undefined")
{
window.ero.setBoundingArea(
new Microsoft.Web.Geometry.Point(0,0),
new Microsoft.Web.Geometry.Point(document.body.clientWidth,document.body.clientHeight));
var eroContent="<p>";
if(title.length>0)eroContent+="<div class=\"VE_Pushpin_Popup_Title\">"+unescape(title)+"</div>";
if(pin.Details.length>0)eroContent+="<div class=\"VE_Pushpin_Popup_Body\">"+unescape(pin.Details)+"</div>";
if(!document.all&&(title.length==0||details.length==0))
eroContent+="<br/><br/>";
eroContent+="</p>";
window.ero.setContent(eroContent);
window.ero.display(e);
}
}
function AddPin()
{
pin = new VEPushpin(0,
new VELatLong(45.3652, -87.54448),
'',
'COMPANY NAME HERE',
'INFORMATION HERE'
);
VEPushpin.ShowDetailOnMouseOver = true;
VEPushpin.OnMouseOverCallback _ PinHover;
map.AddPushpin(pin);
pin = new VEPushpin(1,
new VELatLong(45.3652, -87.54448),
'',
'COMPANY NAME HERE',
'INFORMATION HERE'
);
VEPushpin.ShowDetailOnMouseOver = true;
VEPushpin.OnMouseOverCallback = PinHover;
map.AddPushpin(pin);
pin = new VEPushpin(2,
new VELatLong(45.3652, -87.54448),
'',
'COMPANY NAME HERE',
'INFORMATION HERE'
);
VEPushpin.ShowDetailOnMouseOver = true;
VEPushpin.OnMouseOverCallback = PinHover;
map.AddPushpin(pin);
pin = new VEPushpin(3,
new VELatLong(45.3652, -87.54448),
'',
'COMPANY NAME HERE',
'INFORMATION HERE'
);
VEPushpin.ShowDetailOnMouseOver = true;
VEPushpin.OnMouseOverCallback = PinHover
map.AddPushpin(pin);
pin = new VEPushpin(4,
new VELatLong(45.3652, -87.54448),
'',
'COMPANY NAME HERE',
'INFORMATION HERE'
);
VEPushpin.ShowDetailOnMouseOver = true;
VEPushpin.OnMouseOverCallback = PinHover;
map.AddPushpin(pin);
}
function onPinLoad(pin)
{
pin.style.zIndex = 102;
pin.parentNode.style.zIndex = 102;
}
VEPushpin.prototype.GetContent= function()
{
var pinId=this.ID+"_"+this.m_vemap.GUID;
var content="<img onload='onPinLoad(this)' class='"+this.IconStyle+"' src='"+this.Iconurl+"' id='"+pinId+"' ";
var isTitleValid=this.Title!=null&&this.Title!="undefined"&&this.Title.length>0;
var isDetailsValid=this.Details!=null&&this.Details!="undefined"&&this.Details.length>0;
if(isTitleValid||isDetailsValid)
{
content+=" onmouseout='VEPushpin.Hide();' onmousedown='VEPushpin.Hide(true);' onmouseover='VEPushpin.Show(\""
+this.m_vemap.GUID
+"\",\""
+this.ID
+"\","
+this.LatLong.Latitude
+","+this.LatLong.Longitude;
if(isTitleValid)content+=", \""+escape(this.Title)+"\"";
else content+=",\"\"";
if(isDetailsValid)content+=", \""+escape(this.Details)+"\"";
else content+=",\"\"";
content+=",\""+this.TitleStyle+"\"";
content+=",\""+this.DetailsStyle+"\"";
content+=");' ";
}
//this adds the click event
content += " onclick='PinClick(" + this.ID + ")'";
content+=" />";
return content;
}
function PinClick(id)
{
switch (id)
{
case 0:
document.getElementById('txt1').value = ("ID 0");
break;
case 1:
document.getElementById('txt1').value = ("ID 1");
break;
case 2:
document.getElementById('txt1').value = ("ID 2");
break;
case 3:
document.getElementById('txt1').value = ("ID 3");
break;
case 4:
document.getElementById('txt1').value = ("ID 4");
break;
}
}
function FindDir()
{
var to = document.getElementById('txtStart').value;
var from = document.getElementById('txt1').value;
map.GetRoute(to,from,null,null,onGotRoute);
}
function onGotRoute(route)
{
var routeinfo="Route info:<br><br>";
routeinfo+="Total distance: ";
routeinfo+= route.Itinerary.Distance+" ";
routeinfo+= route.Itinerary.DistanceUnit+"<br>";
var steps="";
var len = route.Itinerary.Segments.length;
for (var i =0; i < len; i ++)
{
steps+=route.Itinerary.Segments[ i ].Instruction
steps+=route.Itinerary.Segments[ i ].Distance
steps+=route.Itinerary.DistanceUnit+"<br>";
}
routeinfo+="Steps:<br>"+steps;
document.getElementById('drivingDirections').innerHTML = routeinfo;
}
</script>
</head>
<body onload="GetMap();">
<div id="myMap" style="position:relative; width:705px; height:505px;"></div>
Origin: <INPUT id="txtStart" type="text" name="txtStart">
Destination: <INPUT id="txt1" type="text" name="txt1" readonly="true">
<INPUT id="getdir" type="button" value="Get Directions" name="getdir" onclick="FindDir();"><br>
<div id="drivingDirections" style="position:relative; width:705px; height:160px;"></div>
</body>
</html>
I HOPE YOU CAN HELP! lol I have been working on this forever and just want to get it done! lol Thanks again for all your help.