Avatar billede Oakster Nybegynder
20. august 2015 - 15:20 Der er 1 løsning

GoogleMap skal centrere via en funktion

Jeg har en hobby-hjemmeside for min families slægt, og vil for hver person  gerne vise et Googlemap med 5+ markører. Mappet starter ud med at centrere på Danmark, og med et nationalt zoom.

http://www.zaphir.dk/familien/Profil.asp?ID=203

Der er på profil-siden grafiske ikoner for de forskellige begivenheder i livet. Når man klikker på en af dem skulle mappet gerne centrere til begivenhedens LatLng og skifte til zoom 12. Men det virker ikke når jeg benytter mig af funktionens parametre -selvom en alert fint viser de overførte værdier.

Hvad er det jeg gør galt, og hvordan tackler jeg det?

    <%
    call openConn
    Sql = "select * from family where id = "& request.querystring("ID")
    call queryconn
    public BirthLat
    BirthLat = rs("CoordBirthLat")
    public BirthLng
    BirthLng = rs("CoordBirthLng")
    public BaptiLat
    BaptiLat = rs("CoordBaptiLat")
    public BaptiLng
    BaptiLng = rs("CoordBaptiLng")
    public ConfiLat
    ConfiLat = rs("CoordConfiLat")
    public ConfiLng
    ConfiLng = rs("CoordConfiLng")
    public DeathLat
    DeathLat = rs("CoordDeathLat")
    public DeathLng
    DeathLng = rs("CoordDeathLng")
    public BurialLat
    BurialLat = rs("CoordBurialLat")
    public BurialLng
    BurialLng = rs("CoordBurialLng")
    rs.close%>

<script src="http://maps.googleapis.com/maps/api/js"></script>

<script>
var map
var myBirth = new google.maps.LatLng("<%=BirthLat%>","<%=BirthLng%>");
var myBapti = new google.maps.LatLng("<%=BaptiLat%>","<%=BaptiLng%>");
var myConfi = new google.maps.LatLng("<%=ConfiLat%>","<%=ConfiLng%>");
var myDeath = new google.maps.LatLng("<%=DeathLat%>","<%=DeathLng%>");
var myBurial = new google.maps.LatLng("<%=BurialLat%>","<%=BurialLng%>");

function initialize()
{
    var mapProp = {
      center:myCenter,
      zoom:5,
      disableDefaultUI:true,
      mapTypeId:google.maps.MapTypeId.ROADMAP
};
     
map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
   
    if (myBirth > "") {
        var marker1=new google.maps.Marker({position: myBirth,
        icon:'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=F|33CC33', animation:google.maps.Animation.DROP,zIndex: 1});
        marker1.setMap(map);
    }

    if (myBapti > "") {
        var marker2=new google.maps.Marker({ position: myBapti,
        icon:'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=D|00FFCC', animation:google.maps.Animation.DROP,zIndex: 2});
        marker2.setMap(map);
    }

    if (myConfi > "") {
        var marker3=new google.maps.Marker({ position: myConfi,
        icon:'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=K|0066FF', animation:google.maps.Animation.DROP,zIndex: 3});
        marker3.setMap(map);
    }

    if (myDeath > "") {
        var marker4=new google.maps.Marker({ position: myDeath,
        icon:'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=B|FF0000', animation:google.maps.Animation.DROP,zIndex: 4});
        marker4.setMap(map);
    }

    if (myBurial > "") {
        var marker5=new google.maps.Marker({ position: myBurial,
        icon:'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=G|806060', animation:google.maps.Animation.DROP,zIndex: 5});
        marker5.setMap(map);
    }
}
var myCenter = new google.maps.LatLng(56.418169, 10.863707);
google.maps.event.addDomListener(window, 'load', initialize);

function mapFocus(x,y)
{
var thisLat = x, thisLng = y;
alert (thisLat,thisLng);
map.panTo(57,12);
map.setZoom(12);
};
</script>


kode for function callers
<img src="http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=F|33CC33" onclick="mapFocus('<%=BirthLat%>,<%=BirthLng%>')">
Avatar billede Oakster Nybegynder
21. august 2015 - 14:00 #1
Det var så 2 fejl...

Syntax i min funktionskalders parameterangivelse [...%>','<%...]
<img src="http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=F|33CC33" onclick="mapFocus('<%=BirthLat%> , <%=BirthLng%>')">

Og forsøg på at kalde en funktion på en div, og ikke et map objekt...
function mapFocus(lat,lng)
{
var center = new google.maps.LatLng(lat, lng);
map.panTo(center);
map.setZoom(12);
};

-fik det hele til at virke!
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester