Formular in einem jpeg ?

[selfmade01]

hallo,
ich programmiere gerade eine kleine Haussteuerung.
Dabei möchte ich eine Zeichnung (jpeg od. png, z.B. der Grundriss der Wohnung) nutzen um darin Daten einzugeben und später auch anzuzeigen.
geht das? wenn ja gibt es dazu ein Beispiel?

Grüße Jürgen

 

[micjun18]

Mach doch erstmal Beispiel was da genau passieren soll. Klingt erstmal abenteuerlich.

 

[zeroice]

Hi,
na klar geht das. Vermute mal du willst auf dem Grundriss dann alle Aktoren und Sensoren und deren jeweiligen Zustand anzeigen? Da du nicht geschrieben hast mit welcher Programmiersprache du sowas programmieren willst werf ich mal Qt in den raum. Allerdings gibt es sowas auch schon fertig. Z.B. FHEM und konsorten haben sowas bereits integriert

 

[BeBur]

Das geht vermutlich mit PDF. Da kannst du Bilder einfügen und auch Formulare definieren.

 

[abcddcba]

Die Frage ist doch erstmal, welche Sprache nutzt du grade und welche Sprachenr beherrscht du überhaupt? Dass man in JPEG und PNG keine FormularFelder einbetten kann, ist schon mal klar - bzw. mir ist nichts bekannt und ich wüsse auch nicht wozu man das so rum machen sollte. Wenn dann wäre das wohl eher "JPEG in Formular"

Was du natürlich machen kannst ist ein Formular zu bauen und das Bild das als Hintergrund resp. ein Layer dahinter.

Aber wie gesagt, du musst dich erstmal für eine Sprache entscheiden. Und wie @BeBur schon sagt, nur wie die Anzeige geht auch PDF. Aber wenn das ganze in einer Anwendung mit Interaktion irgendwie passieren soll, dann wohl nicht geeignet

 

[selfmade01]

Sorry..bin gerade unterwegs

Ich programmiere alles was auf dem webfrontend angezeigt und eingegeben werden soll in PHP UND JQUERY...wobei diese nur Daten mit Daten aus einer MySQL Arbeiten...die Sensoren hängen alle an arduinos und diese Schreiben die Daten auch in die MySQL bzw. Arbeiten mit Werten aus dieser.

Damit mein webfrontend komfortabler wird soll auf der Webseite ein Grundriss der Wohnung gezeigt werden...dort sehe ich die Werte wie Temp etc...und kann aber auch Werte eingeben..dazu brauche ich etwas wo ich in jpegs oder PDFs formularfelder einfügen kann..

Grüsse Jürgen

 

[Andreas_]

Die einfachste Lösung wäre dann vermutlich, wie schon abcddcba geschrieben hat, das jpg-Bild als Hintergrundbild zu verwenden und die Ein-/Ausgabe-Felder mittels css entsprechend zu platzieren.

 

[selfmade01]

Das geht vermutlich mit PDF. Da kannst du Bilder einfügen und auch Formulare definieren.

Hallo

@Andreas_ und @abcddcba hat gemeint das ich wohl ein JPEG als Hintergrund verwenden sollte und dann via CSS die Felder plaziere... mmmh ich weiss nicht wie weit das dann auch fürs Smartphone geeignet ist ob sich dann alles 1zu1 korrekt anpasst (ich kann später sowohl mit dem Browser vom PC als auch über Smartphone zugreifen da ich ein Template verwende das dies zulässt).

Die Lösung mit dem PDF interessiert mich... gibt es dazu Beispiele und mit dem normalen Acrobat kann ich ja keine PDF-Formulare erstellen... bräuchte ich hierzu einen speziellen Editor?

 

[Rossie]

[...] hat gemeint das ich wohl ein JPEG als Hintergrund verwenden sollte und dann via CSS die Felder plaziere... mmmh ich weiss nicht wie weit das dann auch fürs Smartphone geeignet ist ob sich dann alles 1zu1 korrekt anpasst.

Das liegt ganz an Dir. Mit HTML bist Du flexibel und könntest z.B. den Grundriss in einzelne Bereiche aufteilen, die wenn genug Platz da ist, wie das Original angezeigt werden und ansonsten nacheinander (kann man dann auch schön platzsparend implementieren, dass man die Grafiken und Felder erst dann anzeigt, wenn man den gewünschten Raum anklickt). Oder man zeigt eine kleine Raumübersicht und nach Klick eine Eingabemaske für den jeweiligen Raum.

Mit einem PDF hast Du hingegen das Problem, dass Du auf einem Smartphone zoomen musst, da ansonsten die Felder zu klein werden. Vermutlich leidet mit den Feldern auch die Übersicht.

 

[selfmade01]

Das liegt ganz an Dir. Mit HTML bist Du flexibel und könntest z.B. den Grundriss in einzelne Bereiche aufteilen, die wenn genug Platz da ist, wie das Original angezeigt werden und ansonsten nacheinander (kann man dann auch schön platzsparend implementieren, dass man die Grafiken und Felder erst dann anzeigt, wenn man den gewünschten Raum anklickt). Oder man zeigt eine kleine Raumübersicht und nach Klick eine Eingabemaske für den jeweiligen Raum.

ok..
Danke das leuchte mir ein
nun zur Umsetzung bzw. wie ich mir das vorstellen muss.

Wenn ich einen definierten Bereich habe in dem meine Hintergrundgrafik plaziert wird
kann/muss ich dann diesen Bereich auf der Webseite nochmals in einzelne Felder aufteilen...
z.B. wie eine Tabelle die ich irgendwo auf meiner Webseite Plaziere?
und in diesen dann definierten Feldern plaziere ich dann meine Formularfelder?

wenn dem so ist, dann würde sich dann auch je nach Bildschirmauflösung und Browserfenster das ganze schön anpassen oder?

ich versuche gerade hier die Basics des ganzen zu verstehen (programmiere das Ganze als reines Hobby)

 

[Rossie]

Wenn ich einen definierten Bereich habe in dem meine Hintergrundgrafik plaziert wird kann/muss ich dann diesen Bereich auf der Webseite nochmals in einzelne Felder aufteilen...

Einfacher ist es, wenn Du eine Grafik hast und je nachdem wo geklickt wird, eine Maske mit den Feldern für diesen Raum anzeigst. Die Grafik skaliert automatisch bzw. kannst Du für verschiedene Größen verschiedene Grafiken verwenden.

z.B. wie eine Tabelle die ich irgendwo auf meiner Webseite Plaziere?
und in diesen dann definierten Feldern plaziere ich dann meine Formularfelder?

Tabellen skalieren nicht gut und sind für einen Grundriss auch nicht flexibel genug. Besser wäre es ein eigenes Grid zu definieren und je nach Auflösung die verschiedenen (Raum)Elemente anzordnen. Dann klappt es auch mit verschiedenen Größen und Auflösungen.

 

[selfmade01]

Besser wäre es ein eigenes Grid zu definieren und je nach Auflösung die verschiedenen (Raum)Elemente anzordnen. Dann klappt es auch mit verschiedenen Größen und Auflösungen.

Genau das gibt mir auch mein Template her, mit dem ich arbeite.
ok dann habe ich es soweit verstanden

Danke