Passer une div contenant une gmap en image

**Msysteme** · 15/05/2014, 13h21

J'ai une div contenant gmap, j'ai 3 boutons :

- Localiser : qui crée un marker avec une infowindow
- getPlaces : a l'aide de places library je localise tous les stations de services dans un rayon de 5000 et place des markers
- getImage : qui doit me retourner l'etat de la carte avec un seul marker et infowindow ou tous les markers

J'ai mis une fonction javascript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function getImage(titre, objet) {
        // Définition de la zone à imprimer 
        var zone = document.getElementById(objet).innerHTML;
 
        // Ouverture du popup 
        var fen = window.open("", "", "height=600, width=800,toolbar=0, menubar=0, scrollbars=1, resizable=1,status=0, location=0, left=10, top=10");
 
        // style du popup 
        fen.document.body.style.color = '#000000';
        fen.document.body.style.backgroundColor = '#FFFFFF';
        fen.document.body.style.padding = "20px";
 
        // Ajout des données a imprimer 
        fen.document.title = titre;
        fen.document.body.innerHTML += " " + zone + " ";
 
        // Impression du popup 
        fen.window.print();
 
        //Fermeture du popup 
        fen.window.close();
        return true;
}

et dans la page asp un lien :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="#" onclick="javascript:getImage('titre', 'gmap_canvas');">Cliquez ici pour imprimer la zone</a>

La fonction marche tres bien mais le seul problème c'est que les markers n’apparaît pas sur l'image a télecharger mais les infobulles apparentaient sans probleme

veuillez me donner un coup de pousse

**Msysteme** · 15/05/2014, 14h18

J'ai trouvé une discussion sur le forum,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function printMap2() {
    //var contenue = document.getElementById('print_content').innerHTML;
    var content_map = document.getElementById('gmap_canvas').parentNode.innerHTML;
    var docprint = window.open('', '');
    var html = '<html><head><title>Imprimer Carte Texte<\/title>';
    html += '<style type="text/css">#gmap_canvas{width: 700px;height: 600px;}</style>';
    html += '<\/head><body _onload="self.print()"><table>';
    html += '<tr><td style="width:700px;height:600px;">';
    html += content_map;
    html += '<\/td>';
    //html += '<td>Legends ici<\/td><\/tr><tr><td>';
    //html += contenue;
    html += '<\/tr>';
    docprint.document.open();
    docprint.document.write(html);
    docprint.document.close();
    docprint.focus();
}

mais toujours les markers n’apparaît pas

**NoSmoking** · 25/05/2014, 15h48

Bonjour,
il existe une solution qui consiste à créer ta propre image avec les détails que tu souhaites voir apparaître et ce à partir de la carte affichée, pour ceci on utilise la Google Maps Image APIs.

Un exemple d’application Création d'une Static Map à partir d'un itinéraire.

**Msysteme** · 03/06/2014, 10h17

Bonjour, Merci pour l'exemple qui repond exactement a ce que je cherche

Puis je avoir le code source de l'exemple ?

y a t il une possibilité de copier l'url affiché lors de mes traitement au fur et mesure et de le convertir en image statique, sachant que mes données sont alétoire et se genere automatiquent ? je voulais essayé ca mais j'ai decouvert que l'url ne change pas (sous iis) alors ma carte map change

**Spartacusply** · 03/06/2014, 10h30

Puis je avoir le code source de l'exemple ?

Clic droit -> "code source de la page"

Passer une div contenant une gmap en image [Google Maps]

APIs Google

Discussions similaires

Partager

Partager