Trafic - Carte alternative avec Waze

[Chrominator]

J'ai ajouté un onglet aux Custom Pages pour afficher la circulation en cours.
C'est équivalent à la carte déjà présente, mais j'aime bien Waze.
D'autre méthodes sont applicables, j'ai pas trop forcé ici

C'est pas très compliqué, il faut 4 choses :

• Déterminer les coordonnées (Lat/lon) qui seront le centre de la carte
• Un icône pour l'onglet de la page.
  A enregistrer dans domoticz/www/monitor/icons/menu

  

  waze-icon.png (2.35 Kio) Consulté 8906 fois

• Un petit fichier html qui va intégrer une iframe Waze.
  Je l'ai appelé waze.html
  A enregistrer dans domoticz/www/monitor/pages/

  Code : Tout sélectionner

  <!-- load page stylesheet -->
  <script>
  $('head').append('<link rel="stylesheet" href="css/iframe.css">');
  </script>
  
  
  <!-- Page -->
  <div class="cnt v-wrap">
  <div class="v-box">
  <!-- contenu -->
  
  <!--
  le contenu de votre page ne doit pas dépasser les dimensions suivantes
  largeur: 962px
  hauteur: 500px
  -->
  
  <div>
  <div class="frame ">
  <iframe  src='https://embed.waze.com/fr/iframe?zoom=12&lat=49.00000&lon=2.410000&pin=1 width="300" height="400"' ></iframe>
  </div>
  </div>
  
  
  
  <!-- fin contenu -->
  </div>
  </div>
  <!-- fin page -->

  Il faut modifier la ligne <iframe src= pour indiquer votre latitude, longitude et zoom.
  Pour ce dernier, choisir une valeur en 3 et 17.
  17 est le zoom le plus fort (voir cette page pour les paramètres).
• Modifier votre frontpage_settings.js pour y ajouter la nouvelle page.
  Ajoutez le code suivant la liste des pages à afficher (après la syntaxe $.PagesList = [)

  Code : Tout sélectionner

  ['waze.html','waze-icon.png'],

Ensuite, purger le cache du navigateur et la custom page devrait afficher qqch comme ceci :

Exemple de trafic Waze

Capture.PNG (1.04 Mio) Consulté 8906 fois

Suivant l'accord de licence Waze, il est interdit d'afficher le logo et la carte Waze à côté d'une autre provenant d'un concurrent.
Mais j'estime qu'étant chez moi pour une mise à disposition chez moi uniquement (l'accès n'est pas public), je ne viole pas cet accord.

Enjoy !

[Golgotha84]

Merci Chrominator !
Je débute en Custom Page, j'adore ta proposition mais impossible de la faire fonctionner. Je suis à la lettre ce que tu expliques + j'ai repris le fichier iframe.html qui est le meme que waze mais avec le lien vers easydomoticz...et pas moyen.
J'ai bien le logo qui apparait à gauche mais lorsque je clique dessus, une page vide. Si je mets le lien directement dans Chrome, j'ai bien la page:
Voici l'iframe.
iframe src='https://embed.waze.com/fr/iframe?zoom=1 ... 0000&pin=1 width="300" height="400"' >
</iframe>

J'ai désactivé toutes les autres pages sauf Météo pour tester et toujours ko. Une idée ? Est-ce que cela fonctionne toujours pour toi ?

[Golgotha84]

Suffit de chercher... y'a quelque chose dans le copier/coller du code qui n'est pas passé ou alors dans le iframe, c'est des " au lieu de '... bref. J'ai copié le fichier iframe.html que j'ai mis avec le logo waze : ok, j'ai changé le lien vers le lien wave: ok...
Du coup, c'est top Désolé pour la lecture inutile.

[Chrominator]

Content que tu es fini par trouver.


Parfois il faut laisser un peu de temps, faire une pause et la solution vient toute seule, alors qu'en insistant on ne trouve pas le défaut.

[Popo]

Super, seul problème j'ai un tout petit plan illisible qui reste tout petit en haut à gauche de ma page Web.
Comment ajuster les dimensions et la position du plan au sein de la page ?

[romainom31]

Bonjour a tous,

Merci pour ces explications,

J'ai le meme probleme, cad que le cadre de la carte est en tout petit

Quelqu'un a une idée ?

Merci d'avance,

Romain