Widget:GOV-Test: Unterschied zwischen den Versionen
Aus Altes Köln
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
Zeile 13: | Zeile 13: | ||
<h1>Laden der Grafik mit übergeordneten Objekten mit Javascript (fetch)</h1> | <h1>Laden der Grafik mit übergeordneten Objekten mit Javascript (fetch)</h1> | ||
< | <script> | ||
// URL des Bildes | |||
const imageUrl = 'https://gov.genealogy.net/item/relationshipGraph/HOHAUSJO30MX?full-size=1'; | |||
// Abrufen des Bildes | |||
fetch(imageUrl) | |||
.then(response => { | |||
// Prüfen, ob die Antwort erfolgreich ist | |||
if (!response.ok) { | |||
throw new Error(`HTTP error! status: ${response.status}`); | |||
} | |||
return response.blob(); // Die Bilddaten als Blob zurückgeben | |||
}) | |||
.then(blob => { | |||
// Erstellen eines URL-Objekts für das Bild | |||
const imageObjectUrl = URL.createObjectURL(blob); | |||
// Einfügen des Bildes in die Seite | |||
const imgElement = document.createElement('img'); | |||
imgElement.src = imageObjectUrl; | |||
imgElement.alt = 'Beziehungsgraph'; | |||
imgElement.style.maxWidth = '100%'; // Optional: Bild skalieren | |||
imgElement.style.height = 'auto'; | |||
// Bild in das Ziel-Element einfügen | |||
document.getElementById('external-content').appendChild(imgElement); | |||
}) | |||
.catch(error => { | |||
console.error('Error loading image:', error); | |||
}); | |||
</script> | |||
<h1>Einfaches HTML (nur Hyberlink auf GOV)</h1> | <h1>Einfaches HTML (nur Hyberlink auf GOV)</h1> |
Version vom 12. Januar 2025, 18:23 Uhr
Laden der GOV-Seite mit Javascript (fetch)
<script>
fetch('https://gov.genealogy.net/item/show/HOHAUSJO30MX') .then(response => response.text()) .then(data => { document.getElementById('external-content').innerHTML = data; }) .catch(error => { console.error('Error loading external content:', error); });
</script>
Laden der Grafik mit übergeordneten Objekten mit Javascript (fetch)
<script>
// URL des Bildes const imageUrl = 'https://gov.genealogy.net/item/relationshipGraph/HOHAUSJO30MX?full-size=1';
// Abrufen des Bildes fetch(imageUrl) .then(response => { // Prüfen, ob die Antwort erfolgreich ist if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } return response.blob(); // Die Bilddaten als Blob zurückgeben }) .then(blob => { // Erstellen eines URL-Objekts für das Bild const imageObjectUrl = URL.createObjectURL(blob);
// Einfügen des Bildes in die Seite const imgElement = document.createElement('img'); imgElement.src = imageObjectUrl; imgElement.alt = 'Beziehungsgraph'; imgElement.style.maxWidth = '100%'; // Optional: Bild skalieren imgElement.style.height = 'auto';
// Bild in das Ziel-Element einfügen document.getElementById('external-content').appendChild(imgElement); }) .catch(error => { console.error('Error loading image:', error); });
</script>
Einfaches HTML (nur Hyberlink auf GOV)
Hello World
Die GOV-Daten <a href="https://gov.genealogy.net/item/show/HOHAUSJO30MX">finden Sie hier</a>.
Aufruf von GOV mit Object
<object data="https://gov.genealogy.net/item/show/HOHAUSJO30MX" width="600" height="400"></object>
Aufruf von GOV mit Iframe