Ergebnis 1 bis 3 von 3

Thema: Harte Nuss - Per html transparente Bilder übereinander legen um Gesamtbild zu erzeuge

  1. #1
    HTML Newbie
    Registriert seit
    03.06.2015
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Idee Harte Nuss - Per html transparente Bilder übereinander legen um Gesamtbild zu erzeuge

    Hallo Gemeinde,
    ich sitze an einer harten Nuss:
    Wir wollen eine Schnittzeichnung (schwarz-weiß, Hintergrund) eines technischen Produktes erzeugen, bei der einzelne Komponenten farbig angezeigt werden sollen (transparente Bilder, mit farbigen Feldern). Hierfür haben wir ein Excel-Makro geschrieben, welches aus einer Teilestückliste und der Auswahl, welche Komponenten in der Schnittzeichnung farbig angezeigt werden sollen, automatisch ein html-file erzeugt.
    Dieses html-file soll erst die Schnittzeichnung im Hintergrund laden, danach die Komponentenzeichnungen (hintergrund transparent) darüber legen. In unserem Fall gibt es ca. 400 Komponenten. Die Bilder (.png) haben eine Datengröße von 370 kb (Hintergrundbild) und ca. 80kb (Komponentenbild).
    Der html-code sieht beispielhaft folgendermaßen aus (ich bin html-Neuling):
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <!-- diese Datei wurde über eine Excel-VBA-Prozedur erstellt-->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>HTML Schnittzeichnung</title>
    </head>
    
    <body bgcolor="#ffffff">
    
    <img style="position: absolute; width: 100%; height: auto; z-index:1;" src="basiszeichnung.png"; alt="basiszeichnung.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:2;" src="0072-0010.png"; alt="0072-0010.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:3;" src="0072-0020-0010.png"; alt="0072-0020-0010.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:4;" src="0072-0020-0020.png"; alt="0072-0020-0020.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:5;" src="0072-0030.png"; alt="0072-0030.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:6;" src="0072-0040.png"; alt="0072-0040.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:7;" src="0118-0010-0010.png"; alt="0118-0010-0010.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:8;" src="0118-0030.png"; alt="0118-0030.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:9;" src="0118-0040.png"; alt="0118-0040.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:10;" src="0118-0050.png"; alt="0118-0050.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:11;" src="0118-0180.png"; alt="0118-0180.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:12;" src="0150-0900-0200.png"; alt="0150-0900-0200.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:13;" src="0150-0900-0220-0010.png"; alt="0150-0900-0220-0010.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:14;" src="0150-0900-0240.png"; alt="0150-0900-0240.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:15;" src="0150-0900-0270.png"; alt="0150-0900-0270.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:16;" src="0150-0910-0900-0010-0010.png"; alt="0150-0910-0900-0010-0010.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:17;" src="0150-0910-0900-0010-0020.png"; alt="0150-0910-0900-0010-0020.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:18;" src="0150-0910-0900-0010-0030.png"; alt="0150-0910-0900-0010-0030.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:19;" src="0150-0910-0900-0020.png"; alt="0150-0910-0900-0020.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:20;" src="0150-0910-0900-0026.png"; alt="0150-0910-0900-0026.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:21;" src="0150-0910-0900-0030.png"; alt="0150-0910-0900-0030.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:22;" src="0150-0910-0900-0080.png"; alt="0150-0910-0900-0080.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:23;" src="0150-0910-0900-0090.png"; alt="0150-0910-0900-0090.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:24;" src="0150-0910-0900-0100.png"; alt="0150-0910-0900-0100.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:25;" src="0150-0910-0900-0110.png"; alt="0150-0910-0900-0110.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:26;" src="0150-0910-0900-0160.png"; alt="0150-0910-0900-0160.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:27;" src="0150-0910-0900-0180.png"; alt="0150-0910-0900-0180.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:28;" src="0150-0910-0910-0030-0010.png"; alt="0150-0910-0910-0030-0010.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:29;" src="0150-0910-0910-0030-0020.png"; alt="0150-0910-0910-0030-0020.png">
    <img style="position: absolute; width: 100%; height: auto; z-index:30;" src="0150-0910-0910-0050.png"; alt="0150-0910-0910-0050.png">
    </body>
    </html>
    Problem:
    - Das Hintergrundbild und ca. 20 Komponentenzeichnungen werden problemlos angezeigt, weitere Komponenten werden nicht geladen (X am linken oberen Bildrand)
    Fragen:
    - Da ich ziemlicher html-Neuling bin, weiß ich nicht ob der Code alles beinhaltet, was benötigt wird.
    - Warum werden ab 20 Bilder keine weiteren mehr geladen? (ich verwende den Internet Explorer 9)
    Über jegliche Information bin ich dankbar!
    Viele Grüße
    Tob
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Harte Nuss - Per html transparente Bilder übereinander legen um Gesamtbild zu erz

    Wie rufst Du die Datei auf? Lokal oder auf einem Webserver per http?
    Liegen die Dateien denn auch alle da? Also auch die die nicht angezeigt werden?
    Wenn sie vorliegen - wurde auf Groß-/Kleinschreibung geachtet (relevant wenn Du die Datei über http auf einem Linux-Server lädst)?

    Und letztlich noch eine konzeptionelle Frage: warum HTML und nicht SVG?

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    03.06.2015
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Harte Nuss - Per html transparente Bilder übereinander legen um Gesamtbild zu erz

    Hallo threadi,

    danke für deine Antwort!
    Zu deinen Fragen:

    Wie rufst Du die Datei auf? Lokal oder auf einem Webserver per http? Momentan liegen die Dateien lokal, sollen aber später auf einem webserver gespeichert werden, dass auch Nutzer von außerhalb zugreifen können. Beide Varianten habe ich ausprobiert, mit dem selben Fehler: Es werden Bilder beim einen Mal nicht angezeigt, wenn ich aber die Anzahl reduziere und die nicht angezeigten Bilder auswähle, werden diese angezeigt.

    Liegen die Dateien denn auch alle da? Also auch die die nicht angezeigt werden? Alle Bilder liegen im gleichen Verzeichnis

    Wenn sie vorliegen - wurde auf Groß-/Kleinschreibung geachtet (relevant wenn Du die Datei über http auf einem Linux-Server lädst)? Die Bildernamen wurden auch per Makro von der Stückliste erzeugt, entsprechen also 1:1 (inklusive Groß-/Kleinschreibung dem erzeugten html Code

    Und letztlich noch eine konzeptionelle Frage: warum HTML und nicht SVG?
    Ich muss zugeben, SVG kenne ich garnicht. Unser Ziel ist es, dass wir die erzeugten html-files verschicken können, jeder user kann diese mit dem Internet Explorer 9 ohne Zusatzinstallationen öffnen (ob das mit SVG geht weiß ich nicht). Das html-file greift dann auf die Bilder des Servers zu und zeigt das von uns generierte Schnittbild (übereinandergelegten Bilder) an. Wenn es dafür bessere Formate oder Werkzeuge gibt, bin ich für alle Vorschläge offen und dankbar!

    Viele Grüße

    Tobi




Ähnliche Themen

  1. Flexslider: Bilder übereinander..
    Von MarcelDunker im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 10.11.2014, 20:59
  2. Bilder übereinander
    Von Chris95 im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 07.04.2011, 21:06
  3. Bilder übereinander Positionieren
    Von jayjay83 im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 12.09.2009, 19:27
  4. Mehrere Bilder übereinander?
    Von Sohle im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 06.11.2006, 16:22
  5. gif-Dateien übereinander legen
    Von Susanne im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 01.12.2004, 09:48

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •