bing map js on ipad works well

  • Andrey you are the first one giving a feedback after posting this idea four times


    if there are any problems to use it, pleas ask me.
    good documentation for me was this link

    below the code

    if enyone has an idea how to implement a radar function to this script that would be great.


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>vemap</title>
    <style>
    html { height:100%; }
    body { height:100%;
    overflow: hidden;
    margin:0;
    padding:0;
    font-family:Arial, Helvetica, sans-serif;
    font-size:16px; color:#FFFFFF;
    background-color:#000000; }
    a{ color:#AAAAAA; text-decoration:underline; }
    a:hover{ color:#FFFFFF; text-decoration:underline; }
    </style>


    <!--bing VEMAP control-->
    <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>

    <!--myscript-->
    <script>

    //make pos variables for easy handling lat long
    var map = null;
    var center = new VELatLong(47.283987,11.5046291);
    var portal = new VELatLong(47.283374,11.503791);
    var neubau = new VELatLong(47.283681,11.504429);
    var garten = new VELatLong(47.28443,11.505266);
    var internat= new VELatLong(47.284485,11.505467);
    //bing map loading and adding shapes or pushpins.......

    function GetMap()
    {
    map = new VEMap('myMap');
    map.LoadMap(center, 1, VEMapStyle.Birdseye, false);
    //add a oncklik event to the map!!!!!!!!
    map.AttachEvent("onclick", todo);
    AddShapes();
    }

    function AddShapes()
    {
    shapecenter = new VEShape(VEShapeType.Pushpin,center);
    shapecenter.SetCustomIcon("<img src='hotspots/close.png' />");
    shapecenter.ShowIcon();
    map.AddShape(shapecenter);

    shape01 = new VEShape(VEShapeType.Pushpin,portal);
    shape01.SetCustomIcon("<img src='hotspots/mappoint1.png' />");
    shape01.ShowIcon();
    map.AddShape(shape01);

    shape02 = new VEShape(VEShapeType.Pushpin,neubau);
    shape02.SetCustomIcon("<img src='hotspots/mappoint2.png' />");
    shape02.ShowIcon();
    map.AddShape(shape02);

    shape03 = new VEShape(VEShapeType.Pushpin,garten);
    shape03.ShowIcon();
    shape03.SetCustomIcon("<img src='hotspots/mappoint3.png' />");
    map.AddShape(shape03);

    shape04=new VEShape(VEShapeType.Pushpin,internat);
    shape04.SetCustomIcon("<img src='hotspots/mappoint4.png' />");
    shape04.ShowIcon();
    map.AddShape(shape04);

    //adding a polyline or something else

    var points = new Array(portal,neubau,garten,internat);
    polyline = new VEShape(VEShapeType.Polyline, points);
    polyline.HideIcon();
    polyline.SetLineColor(new VEColor(0,255,0,1));
    polyline.SetFillColor(new VEColor(0,0,255,0));
    polyline.SetLineWidth(15);
    map.AddShape(polyline);
    v1()
    timeOut();}

    // most important part to read out the pushpin id to add clickable event.
    function todo(event)
    { if (event.elementID != null)
    {var shape = map.GetShapeByID(event.elementID);
    var id = shape.GetID();
    var id = event.elementID;
    //functionlist!!! 1 document.activeElement.blur(); for prefent ipad keybord from opening
    // 2 v()..4a() pushpin icon change onclick
    // 3 pano_1-4() switches the krpano scene call
    // 4 timeOut() jquery for closing the map DIV after releas pushpin.
    if
    (event.elementID == 'msftve_1000_200001_10001')
    {document.activeElement.blur(); v1();v2a();v3a();v4a();pano_01();timeOut();}
    else if (event.elementID == 'msftve_1000_200002_10002')
    {document.activeElement.blur();v2();v1a();v3a();v4a();pano_02();timeOut();}
    else if (event.elementID == 'msftve_1000_200003_10003')
    {document.activeElement.blur(); v3();v1a();v2a();v4a();pano_03();timeOut();}
    else if (event.elementID == 'msftve_1000_200004_10004')
    {document.activeElement.blur();v4();v1a();v2a();v3a();pano_04();timeOut();}
    else if (event.elementID == 'msftve_1000_200000_10000')
    {document.activeElement.blur();hideMap();
    }}}

    //krpano call functions

    window.pano_01 =function(e)
    {javascript:krpano().call('loadscene(scene_p01)')}
    window.pano_02 =function(e)
    {javascript:krpano().call('loadscene(scene_p02)')}
    window.pano_03 =function(e)
    {javascript:krpano().call('loadscene(scene_p04)')}
    window.pano_04 = function(e)
    {javascript:krpano().call('loadscene(scene_p03)')}

    //change mapspots oncklick

    window.v1=function(e){shape01.SetCustomIcon("<img src='hotspots/activ.gif'/>");}
    window.v2=function(e){shape02.SetCustomIcon("<img src='hotspots/activ.gif'/>");}
    window.v3=function(e){shape03.SetCustomIcon("<img src='hotspots/activ.gif'/>");}
    window.v4=function(e){shape04.SetCustomIcon("<img src='hotspots/activ.gif'/>");}
    window.v1a=function(e){shape01.SetCustomIcon("<img src='hotspots/mappoint1.png'/>");}
    window.v2a=function(e){shape02.SetCustomIcon("<img src='hotspots/mappoint2.png'/>");}
    window.v3a=function(e){shape03.SetCustomIcon("<img src='hotspots/mappoint3.png'/>");}
    window.v4a=function(e){shape04.SetCustomIcon("<img src='hotspots/mappoint4.png'/>");}
    </script>

    </head>

    <!--loading the VEMAP script-->
    <body onload="GetMap()">


    <div id="myMap" style="display:block;position:fixed;width:600px; height:200px;z-index:990;top:10;padding:10px;"></div>

    <div id="panocontent" style="position:absolute;width:100%; height:100%;z-index:000"></div>
    <body>
    </body>
    </html>

    lg
    klaus

  • Funny, on iphone i see a split screen with two times the same pano working indepently from each other.
    Is that meant to be?

    Tuur

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!