kodak Juniormester
02. maj 2020 - 02:09 Der er 5 kommentarer

billede position

Jeg har en XML fil der indeholder Information om hvor billeder skal placeres over en baggrund.

XML'en starter med at oplyse hvilke billede kilder der er til hvilke billede id.

<?xml version="1.0" encoding="UTF-8"?>
    <icwproject name="OVERSKRIFT" version="2">
        <images>
            <image active="cleaning_active.png" id="cleaning" inactive="cleaning_inactive.png" noresource="cleaning_noresource.png" preview="cleaning_preview.png" />  <<-- IKON
            <image active="pendant_active.png" id="pendant" inactive="pendant_inactive.png" noresource="pendant_noresource.png" preview="pendant_preview.png" />  <<-- IKON
            <image file="GG 2.png" id="baggrund-1" />  <<-- BAGGRUND
        </images>


Og fortsætter med placeringer og navne:

        <scenes>
            <scene name="web" type="web">
                <description/>
                <imageref id="baggrund-1" /> <<-- BAGGRUND billede id.
                <sceneelements>
                    <resourcebinaryelement name="" type="" x="44" y="197" z="" r=""> <<-- IKON billede placering.
                        <description/> <<-- IKON MouseOver title/alt
                        <imageref id="tablelamp" /> <<-- IKON billede id.
                        <format fontscaling="70" imagescaling="70" labelcolor="#000000" labelposition="top" /> <<-- IKON størrelse & Tekst farve, størrelse & placering i forhold til billede.
                    </resourcebinaryelement>

Hvordan udlæser jeg disse værdier og får dem til at vise den ønskede baggrund med ikonerne over?
Slater Ekspert
02. maj 2020 - 08:23 #1
Kan vi få noget kontekst omkring hvordan det skal bruges/indlæses?

Du har lagt det i Javascript-kategorien. Betyder det at XML-filen bliver indlæst på et website med AJAX og skal parses i front-end Javascript-kode? Det er i min erfaring ekstremt sjældent at nogen bruger XML med Javascript på den måde. Eller er det måske Node det skal læses i? Eller noget helt andet?

Og hvordan skal det vises? Hvis det ikke er front-end Javascript, snakker vi så stadig om at vise det på et HTML-baseret website? Er positionerne absolutte pixel-placeringer eller noget andet?
kodak Juniormester
02. maj 2020 - 12:51 #2
Tænker javascript er smartest da man senere skal kunne flytte runder på de billeder, eller hvad mener du kan klare det?

Filen er i en mappe, og skal blot vise sit indhold i lag.
Slater Ekspert
02. maj 2020 - 14:49 #3
Okay, så du tænker helt almindelig browser-baseret Javascript der tegner HTML.

Javascript er desværre ikke specielt godt egnet til at arbejde med XML, så egentlig ville jeg foretrække at få en backend til at omformatere det til noget lettere at arbejde med, men det kan sagtens lade sig gøre.

Her er et eksempel på et script der henter filen og opsamler billeddataene:

function fetchXML(url) {
    return fetch(url)
    .then(res => res.text())
    .then(str => (new DOMParser).parseFromString(str, 'application/xml'))
    .then(xml => { return xml; });
}

function buildScene(scene) {
    // Byg HTML elementerne her ud fra scenen.
}

window.addEventListener('DOMContentLoaded', async () => {
    let xml = await fetchXML('data.xml');
    let images = {};
   
    [].forEach.call(xml.getElementsByTagName('images').item(0).children, image => {
        images[image.id] = {
            active: image.getAttribute('active'),
            inactive: image.getAttribute('inactive'),
            preview: image.getAttribute('preview'),
            file: image.getAttribute('file')
        }
    });

    [].forEach.call(xml.getElementsByTagName('scenes').item(0).children, scene => buildScene(scene));
});

Jeg ved ikke om det hjælper dig nok på vej til at du kan lave resten. Ellers må du sige til. Jeg vil bare ikke lave det hele uden feedback fra dig, da det trods alt tager lidt tid.
kodak Juniormester
02. maj 2020 - 16:01 #4
Er det bedre at hente det med php?
kodak Juniormester
02. maj 2020 - 16:19 #5
Jeg tænkte at det skulle ende noget i stil med dette:
https://files.fm/u/axxvqj5v

Blot med fikseringen af ikoner skal være center i stedet for øverste venstre hjørne.
Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links

Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester





Premium
Efter 24 år valgte Niels Elbek at fratræde posten som topchef i Elbek & Vejrup: Se her hvorfor
Gennem 24 år har Niels Elbek stået i spidsen for it-selskabet Elbek & Vejrup, som han har stiftet sammen med Lars Vejrup. Selskabet har kunne fremvise tocifrede vækstrater de seneste mange år, men alligevel takker topchefen nu af - se her hvorfor.
Job & Karriere
På jagt efter et it-job i Jylland? Her er 10 stillinger fra Aabenraa til Aalborg, der ledige netop nu
Vi har fundet en række spændende stillinger til dig, der jagter et it-job. Her kan du vælge og vrage mellem ledige stillinger lige fra Aabenraa til Aalborg.
White paper
Sådan kan du arbejde effektivt uanset tid, sted og type af enhed
Hvad nu hvis dit arbejde, din information, dine processer og teknologien bag ved, var organiseret på en måde så det passede til din organisation – alt sammen guidet af en intelligent udgave af det digitale arbejdsrum? Det er visionen bag Atea og Citrix´s samarbejde med digital workspace – en smartere og mere effektiv måde at arbejde på. I dette whitetpaper kan du derfor læse om, hvordan du kan skabe et mere effektivt og brugervenligt arbejdsrum uanset tid, sted og enhed. En løsning der på en gang er både enkel og som sætter brugeren i centrum.