R-Faltblattkarte in WordPress einbetten

Lesezeit: 4 Minuten

Benutzeravatar von Jacopo
Jacopo

Ich habe gerade eine einfache interaktive Karte mit dem Leaflet-Paket in R erstellt. So etwas in der Art

leaflet() %>% addTiles() 

Jetzt möchte ich es in meine WordPress-Website einbetten.

Ich habe auf die Exportschaltfläche von RStudio Viewer geklickt und “Als Webseite speichern …” ausgewählt und dann die HTML-Datei auf meinem lokalen Computer gespeichert.

Ich habe versucht, diese Karte in einen Beitrag auf meiner WP-Website einzubetten, indem ich im Editor der Seite auf “Medien hinzufügen” klickte und die zuvor gespeicherte .html auswählte. Aber ich bekomme den Fehler:

“1 Datei konnte nicht hochgeladen werden, da der Dateityp nicht unterstützt wird.”

Ich habe versucht, die HTML-Datei in einem Editor zu öffnen und den (sehr langen, voller Koordinaten) HTML-Code zu kopieren und in die HTML-Registerkarte des WP-Seiteneditors einzufügen. Der Editor konvertiert diesen Code in

<div id="htmlwidget_container">
<div id="htmlwidget-2390" class="leaflet html-widget" style="width: 100%; height: 400px;"></div> </div>

und ich sehe keine Karte im visuellen Tab. Ich weiß wirklich nicht, wie ich weiter vorgehen soll. Jede Hilfe wird geschätzt. Wie Sie bemerkt haben, bin ich völlig neu in WP- und Webanwendungen.

Vielen Dank Jacopo

  • Empfehlungen für Off-Site-Tutorials werden für Stack Overflow als nicht zum Thema gehörend betrachtet. Fragen, denen konkrete reproduzierbare Beispiele fehlen, sind schwer zu beantworten. Es wäre hilfreich, so klar wie möglich zu sagen, was Sie versucht haben, und genau zu beschreiben, wie es nicht funktioniert hat.

    – MrFlick

    2. Februar 2017 um 17:11 Uhr

  • Hallo MrFlick, ich habe einige Änderungen basierend auf Ihrem Kommentar vorgenommen, ich hoffe, es ist jetzt besser. Vielen Dank

    – Jakobo

    2. Februar 2017 um 17:56 Uhr

  • Um die Karte mit allen Funktionen einzubetten, benötigen Sie eine Art Container auf der WordPress-Seite, der eine voll funktionsfähige HTML-Webseite mit eigenem CSS und Javascript akzeptieren kann. Versuchen Sie, das Problem auf der WordPress-Seite zu lösen. Durchsuchen Sie die WordPress-Support-Boards.

    – sconfluentus

    3. Februar 2017 um 3:44 Uhr

  • Das ist genau das, wonach ich suche. Ich weiß nichts über HTML, aber ich kann gute Karten in Broschüren erstellen. Ich möchte einen Weg finden, Karten in WordPress anzuzeigen (im Moment habe ich nur einen Premium-Zugang). Ich könnte die Seite auf eine andere Art von Host migrieren.

    – César Arquero

    14. November 2018 um 18:29 Uhr

  • Ich hätte gedacht, die beste Option wäre, eine einfache, glänzende App mit der Broschürenkarte zu erstellen und sie zu hosten shineapps.io und dann die gehostete Shiny-App in und iframe einbetten. Hier ist ein Spaziergang durch Ich fand.

    – Will Hore-Lacy

    16. November 2018 um 5:58 Uhr

Sie können versuchen, das Widget in einer HTML-Datei zu speichern und diese HTML-Datei in Ihre Medienbibliothek zu importieren.

library(htmlwidgets) 
library(DT) 
a <- datatable(iris) 
saveWidget(a, "datatable-iris-example.html")

Als nächstes importieren Sie die .html-Datei in Ihre Medienbibliothek. Fügen Sie dann den Shortcode zu Ihrem Beitrag hinzu. So codieren Sie es auf der Seite, wenn Sie den Blog-Beitrag bearbeiten:

<iframe seamless src="http://www.phillipburger.net/wordpress/wp-
content/uploads/2015/05/datatable-iris-example.html" width="100%" 
height="500"></iframe>

Alle Credits gehen an Phillip Burger und sein Posten.

Hat jemand eine bessere Methode?

  • Der Versuch, dies mit einer in r erstellten Broschüre zu tun. Die Karte wird angezeigt, Markierungen jedoch nicht. Hatte jemand dieses Problem oder weiß wie man es löst? Beim lokalen Öffnen der HTML-Datei sind die Markierungen vorhanden.

    – bpheazye

    24. Mai 2018 um 17:56 Uhr


Ich habe das nicht getestet, aber … meine Logik ist, das rohe HTML-Widget zu verwenden und eine einfache PHP-Include-Zeile hinzuzufügen. irgendwie so

<h3>My aweseome R map</h3>
<?php include 'saved_file.html';?>

Das Konzept stammt von Static Content CMS-Konzepten, bei denen Sie sozusagen vorhandene Stücke importieren.

Schritte:

1) Installieren das Plugin was das Einbetten zusätzlicher Dateierweiterungen ermöglicht, und überprüfen Sie .html auf der Optionsseite dieses Plugins.

2) versuche jetzt hochzuladen .html Datei im WP.

3) Betten Sie die hochgeladene Datei ein als <iframe> Element oder verwenden Sie Plugins wie: schließe mich ein oder Include-URL oder einfach enthalten

Ich weiß, dass dieser Beitrag alt ist, aber ich habe gerade einen Weg dafür zusammengeschustert und wollte ihn teilen.

Ich wusste, dass ich meinen Plot mit derselben Methode wie @OBB3, die oben beschrieben wurde, als HTML-Datei speichern konnte, und ich wusste, dass ich ihn mit in meine Website einbetten wollte <iframe>aber ich konnte nicht herausfinden, wie ich die Datei tatsächlich im Internet hosten sollte, um dann auf meine zu verweisen <iframe> zu.

Am Ende habe ich eine GitHub-Lösung gefunden, die den zusätzlichen Vorteil hat, dass ich meinen Plot einfach ändern, diese Änderungen pushen kann und der Plot automatisch auf meiner Website aktualisiert wird:

  1. Erstellen Sie ein neues Repository
  2. Fügen Sie die .html-Datei Ihres Plots zum Repo hinzu
  3. Gehen Sie zu Einstellungen > Seiten und wählen Sie unter „Quelle“ den Zweig „Haupt“.
  4. Richten Sie Ihren Iframe auf http://Nutzername.github.io/Repository/meinplot (Füllen Sie die fettgedruckten Abschnitte mit Ihrem GitHub-Benutzernamen, dem Namen des Repos bzw. dem Namen der Vorerweiterung Ihrer .html-Datei aus.)

Das Verdienst geht an Elizabeth Ter Sahakyan Post dafür, dass du mir die meisten der oben genannten Dinge beigebracht hast.

Alle Interaktivität und verschiedenen Elemente meiner Handlung sind mit dieser Methode erhalten geblieben.

1386410cookie-checkR-Faltblattkarte in WordPress einbetten

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy