[Frage] Eigene Extension mit Google Map TYPO3-Version: -

  • robin94 robin94
    Typ im Roten Hemd
    0 x
    4 Beiträge
    0 Hilfreiche Beiträge
    19. 11. 2015, 11:10

    Hallo Zusammen

    Ich habe folgendes Problem:

    Ich will eine eigene Extension Programmieren, die aus verschiedenen Einträgen im Backend eine Karte mit mehreren Markern erstellt. jeder Marker soll ein Infowindow haben in dem ein Titel, eine Beschreibung, ein Bild und ein Link dargestellt wird.
    Die karte wird per Javascript dargestellt. Die Daten aus dem Backend werden mit {feldname} ausgelesen. Das Problem ist nur, dass die Daten, die im Infowindow angezeigt werden sollen nicht als String erkannt werden. Auch die konvertierungsmöglichkeiten toString() und String() helfen nicht weiter.
    Ich habe schon ein paar Sachen ausprobiert:

    1. <script type="text/javascript">
    2. var count = 0;
    3. var orte = new Array();
    4. </script>
    5. <f:for each="{orts}" as="ort">
    6. <script type="text/javascript">
    7. orte[count] = new Array();
    8. orte[count][0] = {ort.breitengrad};
    9. orte[count][1] = {ort.laengengrad};
    10. orte[count][2] = {ort.bezeichnung};
    11. orte[count][3] = {ort.beschreibung};
    12. orte[count][4] = {ort.bild};
    13. orte[count][5] = {ort.webseite};
    14. count++;
    15. </script>
    16. </f:for>
    17. <div class="tx_easy_verzeichnis_single_eintrag_karte">
    18. <script src="https://maps.googleapis.com/maps/api/js?v=3.0&sensor=false">
    19. </script>
    20. <div style="overflow:hidden;height:100%;width:100%;">
    21. <div id="gmap_canvas" style="height:100%;width:100%;">
    22. </div>
    23. <style>
    24. #gmap_canvas img{
    25. max-width:none!important;
    26. background:none!important
    27. }
    28. </style>
    29. </div>
    30. <script type="text/javascript">
    31. function init_map(){
    32. var myOptions = {
    33. zoom:15,
    34. center:new google.maps.LatLng(orte[0][0],orte[0][1]),
    35. mapTypeId: google.maps.MapTypeId.ROADMAP
    36. };
    37. map = new google.maps.Map(document.getElementById('gmap_canvas'), myOptions);
    38. for(i=0; i<=count; i++){
    39. marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(orte[i][0],orte[i][1])});
    40. infowindow = new google.maps.InfoWindow({
    41. content: <h1>+orte[i][2]+</h1><div>+orte[i][3]+</div><f:image src=+orte[i][4]+ /><f:link.external uri="+orte[i][5]+">+orte[i][5]+</f:link.external>
    42. });
    43.  
    44. }
    45. marker.addListener('click', function() {
    46. infowindow.open(map, marker);
    47. });
    48. }
    49. google.maps.event.addDomListener(window, 'load', init_map);
    50. </script>
    51. </div>

    Wenn man aber folgende Teile mit /* auskommentiert , werden alle Marker angezeigt:
    1. orte[count][2] = {bezeichnung};
    2. orte[count][3] = {beschreibung};
    3. orte[count][4] = {bild};
    4. orte[count][5] = {webseite};
    5.  
    6. infowindow = new google.maps.InfoWindow({
    7. content: <h1>+orte[i][2]+</h1><div>+orte[i][3]+</div><f:image src=+orte[i][4]+ /><f:link.external uri="+orte[i][5]+">+orte[i][5]+</f:link.external>
    8. });

    Was mache ich falsch? kann mir jemand helfen?

    Freundliche Grüsse
    robin94


  • 1
  • 1