SlideShare a Scribd company logo
1 of 36
Download to read offline
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Ein Vortrag von Robert Kaiser
FileMaker und SVG-Grafiken
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Robert Kaiser – karo.at
Robert Kaiser
• zertifizierter FileMaker Entwickler (10 bis 19)

• Claris Partner

• Werbegrafiker seit 1993

• FileMaker Entwicklung seit 1996

• Autor für FileMaker Magazin

• Sprecher auf der FileMaker Konferenz 

2012, 2013, 2016, 2017
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Robert Kaiser – karo.at
karo productions
• individuelle Lösungen auf der Basis von 

FileMaker Pro/Go/WebDirect

• DTP-Workflow-Optimierung

• Schulungen (Adobe InDesign, Photoshop, u.a.)

• FMM Award 2014, Beste FileMaker Lösung
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Agenda
• Was ist SVG?

• Datenbank für Aufbau von Vorlagen

• Tipps für FileMaker Berechnungen

• Beispiele aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Ziel
• Potential von SVG aufzuzeigen,

auch ohne Bibliotheken und JavaScript
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Nützliche Vorkenntnisse für diesen Vortrag
• FileMaker Webviewer

• Grundkenntnisse in HTML, XML, CSS

• Aber keine JavaScript-Kenntnisse nötig!
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Zum Nachlesen mit vielen Beispielen:
FMK 2016: 

Award-Winner Marcel Moré – The Power of SVG
Empfehlung
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Was ist SVG?
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Definition laut Wikipedia:
„Scalable Vector Graphics (kurz auch SVG, englisch für skalierbare
Vektorgrafik) ist die vom World Wide Web Consortium (W3C) empfohlene
Spezifikation zur Beschreibung zweidimensionaler Vektorgrafiken. SVG,
das auf XML basiert, wurde erstmals im September 2001 veröffentlicht.
Praktisch alle relevanten Webbrowser können einen Großteil des
Sprachumfangs darstellen.“
Was ist SVG?
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Das bedeutet:

• Ist schon lange Web-Standard
-> Läuft somit auch mit alter Browser Engine

• Ist Vektorgrafik, somit skalierbar
-> im Gegensatz zu Pixel-Bildformaten wie JPEG oder PNG

• Basiert auf XML, also Text
-> können wir mit FileMaker Textfunktionen erzeugen oder manipulieren
Was ist SVG?
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Textcode, der im Browser oder Zielprogramm gerendert wird:
Was ist SVG?
Ausgabe im Browser oder Webviewer:
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Auch Symbole bei den Tasteneinstellungen sind SVG:
Was ist SVG?
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Beispiele für Applikationen, um komplexere Grafiken zu erstellen:
• Sketch

• Adobe Illustrator

Was ist SVG?
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Beispieldatenbank:

Grundsätzlicher Aufbau 

mit Webviewer in FileMaker
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Problemstellung aus der Praxis
(Druckerei)
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Erster Einsatz von SVG:
• Relaunch Maschinen-Belegungsplan:

Alte Lösung noch mit FileMaker-Plugin, die nicht gut funktioniert hat, 

bzw. schwer zu pflegen war.

• Neue Lösung:

Umgesetzt noch mit 8 Webviewer, daneben FileMaker-Buttons,
Portale, …

Guter Einstieg, war aber weder elegant noch flexibel.
Problemstellung aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Neue Vorgabe: Erweiterte Integration in Tagesplan:
• Belegungspläne, die darstellen, welche Mitarbeiter auf welcher
Maschine an welcher Produktion arbeiten soll

• war weder mit Portalen, Wiederholfelder, oder Tastenleisten gut zu
realisieren

• Nicht nur zur Ansicht, sondern soll auch Planungstool werden ->
Interaktion muss möglich sein

• Aus Erfahrung wird Funktionalität laufend erweitert bzw. angepasst
Problemstellung aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Überlegung für Relaunch
• Weiter auf SVG setzen?

• Bestärkt durch Anregungen im Vortrag Marcel Moré auf der FMK 2016

Tolle Beispiele von Grafiken (Bibliotheken)

• Ernüchterung

Die benötigten Beispiele und Bibliotheken haben 

unter Windows FM17 nicht funktioniert

• Entwicklung in JavaScript?

keine ausreichenden JavaScript Kenntnisse
Problemstellung aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Nach Tests wurde folgender Lösungsansatz gewählt:
• HTML und SVG Code wird mit FileMaker Scripts berechnet!
Problemstellung aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Grundsätzlich Aufbau:
• Ein Webviewer, HTML Seite mit einer SVG Grafik wird ausgegeben

• Über verschiedene Bausteine wird die SVG Grafik mit FileMaker
Bordmittel befüllt (Platzhalter für Positionen, Stile und Inhalte
austauschen)

• Formatierung mit CSS, lokale Formatierung soll möglich sein 

(z.B. Farben)
Problemstellung aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Für die unterschiedlichen Objekte gibt es je eine Vorlage:

• Baustein Text (Beschriftungen)

• Baustein Fläche (für Hintergründe)

• Baustein Linie (für Darstellung Zeitachsen)

• Baustein Text + Fläche

• Baustein Text + Fläche mit URL

• …
Problemstellung aus der Praxis
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Beispieldatenbank:

Austauschen von Bausteinen
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Vergleich FM Ansatz / JavaScript
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Code-Berechnung mit FileMaker Bordmittel:
• Datensammlung und Gliederung in FM

• Berechnung der Ausgabe (Positionen, Anzeigen) in FM

Vorteile

• Business Logik in FM

-> Debuggen und Wartung in FileMaker Script!

• es müssen keine Bibliotheken geladen oder gewartet werden

• Funktioniert auch mit älteren FileMaker Clients

Nachteile

• Klick, bzw. Statusänderung (Objekt selektiert) 

-> erneutes Rendern des ganzen Webviewers
Vergleich FM Ansatz / JavaScript
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Code-Berechnung in JavaScript:
• Datensammlung und Gliederung in FM

• Berechnung der Ausgabe (Positionen, Anzeigen) in JS

Vorteile

• „Business Logik“ in JS (was passiert bei Klick, 

welche Daten werden übergeben, etc)

-> Allerdings debuggen und Wartung in JavaScript!

• Datenaktualisierung (ab FM19) möglich -> Logik in JS

• Drag & Drop, Animationen etc. möglich

Nachteile

• eventuell JS-Bibliotheken laden und pflegen

• Kompatibilität zu älteren FileMaker Clients
Vergleich FM Ansatz / JavaScript
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Beispieldatenbank:

Interaktion
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Praxisbeispiele
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
FileMaker Tipps
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Speicherort der Code-Snippets (Bausteine)
• Vermeiden von global gespeicherten Feldern (für Serverlösungen,
Ausnahme ist Zwischenspeichern der geladenen Einstellungen)

• Entweder direkt in Variablen ablegen oder vor ersten Ausgabe des
Webviewers aus Tabelle laden

• Ziel ist einfache Wartbarkeit des Codes und der Snippets
FileMaker Tipps
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Webviewer Code berechnen (bei sehr viel Text)
• Verwende den Scriptschritt "Berechneten Wert einfügen" 

(ist schneller als Variable setzen mit Listenfunktion)

• Austauschen-Funktionen: Reihenfolge beachten (zuerst Platzhalter mit
wenig Text ersetzen, z.B. CSS oder Hintergrundfarben, am Ende den
größten Baustein)

• Kompromiss finden zwischen optimierten Code 

(wenige Scriptschritte) und Wartbarkeit / Lesbarkeit
FileMaker Tipps
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Daten für Webviewer
• Strategie für Datenselektion bzw. Zwischenspeicherung überlegen

• Eventuell Daten bereits als JSON Objekt bereithalten, falls die Ausgabe
oder Manipulation später doch über JavaScript erfolgt

Achtung bei mehreren bzw. großen JSON Objekten: 

Es liegt immer nur ein JSON Objekt optimiert im Speicher vor!
FileMaker Tipps
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Datenänderung
• Beachten beim Zurückschreiben, dass die Daten nach dem
Renderzeitpunkt vielleicht geändert wurden.

Sondertasten
• Nicht alle Sondertasten funktionieren auf beiden Plattformen 

(macOS: keine control-Taste; Windows: keine Shift-Taste) 

(keine Alt-Taste und Citrix)

Trigger OnLayoutTastenDruck
• Unter Windows darf Fokus nicht im Webviewer sein, damit Tastendruck
Trigger ordnungsgemäß funktionieren
FileMaker Tipps
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Fragen?
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Vielen Dank für Ihr Interesse!
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Weiterführende Links
Vortrag FMK 2016:
• Marcel Moré - The Power of SVG

https://blog.marcel-more.de/2016/10/14/the-power-of-svg/

Mehr über SVG
• SVG Definition Wikipedia

https://de.wikipedia.org/wiki/Scalable_Vector_Graphics

• Selfhtml

https://wiki.selfhtml.org/wiki/SVG

Hilfsmittel für Grafik-Erstellung
• Sketch

https://www.sketch.com
FileMaker Konferenz | Hamburg | 22.-24. Juni 2022
FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at
Vielen Dank unseren Sponsoren
Danke für das Bewerten dieses Vortrages

More Related Content

What's hot

Api 5 l 44 ed psl 1 & psl 2
Api 5 l 44 ed psl 1 & psl 2Api 5 l 44 ed psl 1 & psl 2
Api 5 l 44 ed psl 1 & psl 2Henry Hutabarat
 
Defeitos no metal de solda
Defeitos no metal de soldaDefeitos no metal de solda
Defeitos no metal de soldaNayara Neres
 
Apostila 1 para publicar
Apostila 1 para publicarApostila 1 para publicar
Apostila 1 para publicarwendelrocha
 
Welding lectures 14 16
Welding lectures 14 16Welding lectures 14 16
Welding lectures 14 16Suraj Aggarwal
 
TS 02 TERMINOLOGIA DA SOLDAGEM.pdf
TS 02 TERMINOLOGIA DA SOLDAGEM.pdfTS 02 TERMINOLOGIA DA SOLDAGEM.pdf
TS 02 TERMINOLOGIA DA SOLDAGEM.pdfARLANFERREIRANUNES
 
Apostila aço inox. soldagem
Apostila aço inox.   soldagemApostila aço inox.   soldagem
Apostila aço inox. soldagemVerlaine Verlaine
 
Presentation on common weld dicontinuities
Presentation on common weld dicontinuitiesPresentation on common weld dicontinuities
Presentation on common weld dicontinuitiesabdul khaliq siddiqui
 
Pengenalan Autodesk Inventor.pptx
Pengenalan Autodesk Inventor.pptxPengenalan Autodesk Inventor.pptx
Pengenalan Autodesk Inventor.pptxRezaFbriadi
 
NBR 10068 - Folha de Desenho - Layout e Dimensões
NBR 10068 - Folha de Desenho - Layout e DimensõesNBR 10068 - Folha de Desenho - Layout e Dimensões
NBR 10068 - Folha de Desenho - Layout e DimensõesMarcos Iury Fernandes
 
Selection of filler wire
Selection of filler wireSelection of filler wire
Selection of filler wireImran Jamil
 
Conformação mecânica - Forjamento
Conformação mecânica - ForjamentoConformação mecânica - Forjamento
Conformação mecânica - ForjamentoGabriel Sana
 
Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50
Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50
Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50Adilio Luis da Silva Camargo
 

What's hot (20)

Api 5 l 44 ed psl 1 & psl 2
Api 5 l 44 ed psl 1 & psl 2Api 5 l 44 ed psl 1 & psl 2
Api 5 l 44 ed psl 1 & psl 2
 
Defeitos no metal de solda
Defeitos no metal de soldaDefeitos no metal de solda
Defeitos no metal de solda
 
CSWIP Intro
CSWIP IntroCSWIP Intro
CSWIP Intro
 
Apostila 1 para publicar
Apostila 1 para publicarApostila 1 para publicar
Apostila 1 para publicar
 
Welding Defects
Welding DefectsWelding Defects
Welding Defects
 
Astm a 516 & a-20
Astm a 516 & a-20Astm a 516 & a-20
Astm a 516 & a-20
 
Exercícios solda
Exercícios soldaExercícios solda
Exercícios solda
 
Welding lectures 14 16
Welding lectures 14 16Welding lectures 14 16
Welding lectures 14 16
 
TS 02 TERMINOLOGIA DA SOLDAGEM.pdf
TS 02 TERMINOLOGIA DA SOLDAGEM.pdfTS 02 TERMINOLOGIA DA SOLDAGEM.pdf
TS 02 TERMINOLOGIA DA SOLDAGEM.pdf
 
Apostila aço inox. soldagem
Apostila aço inox.   soldagemApostila aço inox.   soldagem
Apostila aço inox. soldagem
 
Presentation on common weld dicontinuities
Presentation on common weld dicontinuitiesPresentation on common weld dicontinuities
Presentation on common weld dicontinuities
 
Pengenalan Autodesk Inventor.pptx
Pengenalan Autodesk Inventor.pptxPengenalan Autodesk Inventor.pptx
Pengenalan Autodesk Inventor.pptx
 
NBR 10068 - Folha de Desenho - Layout e Dimensões
NBR 10068 - Folha de Desenho - Layout e DimensõesNBR 10068 - Folha de Desenho - Layout e Dimensões
NBR 10068 - Folha de Desenho - Layout e Dimensões
 
Slides corrosão por corrente de fuga
Slides corrosão por corrente de fugaSlides corrosão por corrente de fuga
Slides corrosão por corrente de fuga
 
Soldagem por alta freq
Soldagem por alta freqSoldagem por alta freq
Soldagem por alta freq
 
Selection of filler wire
Selection of filler wireSelection of filler wire
Selection of filler wire
 
Aula metrologia
Aula metrologiaAula metrologia
Aula metrologia
 
Conformação mecânica - Forjamento
Conformação mecânica - ForjamentoConformação mecânica - Forjamento
Conformação mecânica - Forjamento
 
Guia aco
Guia acoGuia aco
Guia aco
 
Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50
Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50
Vdocuments.site desenho tecnico-mecanico-mailson-561962a913c50
 

Similar to FMK2022 Arbeiten mit SVG in FileMaker - Robert Kaiser

FMK2022 FileMaker und Javascript von Adam Augustin
FMK2022 FileMaker und Javascript von Adam AugustinFMK2022 FileMaker und Javascript von Adam Augustin
FMK2022 FileMaker und Javascript von Adam AugustinVerein FM Konferenz
 
FMK2015: Von Skriptparametern Variablen und Globalen by Patrick Risch
FMK2015: Von Skriptparametern Variablen und Globalen by Patrick RischFMK2015: Von Skriptparametern Variablen und Globalen by Patrick Risch
FMK2015: Von Skriptparametern Variablen und Globalen by Patrick RischVerein FM Konferenz
 
FMK2022 Die Zukunft von FileMaker - Marcel Moré.pdf
FMK2022 Die Zukunft von FileMaker - Marcel Moré.pdfFMK2022 Die Zukunft von FileMaker - Marcel Moré.pdf
FMK2022 Die Zukunft von FileMaker - Marcel Moré.pdfVerein FM Konferenz
 
FMK2017 - GUI Tipps für mobile Lösungen by Robert Kaiser
FMK2017 - GUI Tipps für mobile Lösungen by Robert KaiserFMK2017 - GUI Tipps für mobile Lösungen by Robert Kaiser
FMK2017 - GUI Tipps für mobile Lösungen by Robert KaiserVerein FM Konferenz
 
FMK2022 FileMaker DataAPI und Java von Bernhard Schulz
FMK2022 FileMaker DataAPI und Java von Bernhard SchulzFMK2022 FileMaker DataAPI und Java von Bernhard Schulz
FMK2022 FileMaker DataAPI und Java von Bernhard SchulzVerein FM Konferenz
 
FMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang Wunderlich
FMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang WunderlichFMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang Wunderlich
FMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang WunderlichVerein FM Konferenz
 
FMK2016 - Christian Schmitz - MBS FileMaker Plugin
FMK2016 - Christian Schmitz - MBS FileMaker PluginFMK2016 - Christian Schmitz - MBS FileMaker Plugin
FMK2016 - Christian Schmitz - MBS FileMaker PluginVerein FM Konferenz
 
FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...
FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...
FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...Verein FM Konferenz
 
FMK2018- Web direct fuer Einsteiger Alexis Gehrt
FMK2018- Web direct fuer Einsteiger Alexis GehrtFMK2018- Web direct fuer Einsteiger Alexis Gehrt
FMK2018- Web direct fuer Einsteiger Alexis GehrtVerein FM Konferenz
 
FMK2015: The Power of JavaScript by Marcel Moré
FMK2015: The Power of JavaScript by Marcel MoréFMK2015: The Power of JavaScript by Marcel Moré
FMK2015: The Power of JavaScript by Marcel MoréVerein FM Konferenz
 
FMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen Kalender
FMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen KalenderFMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen Kalender
FMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen KalenderVerein FM Konferenz
 
FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...
FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...
FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...Verein FM Konferenz
 
FMK2017 - MBS FileMaker Plugin by Christian Schmitz
FMK2017 - MBS FileMaker Plugin by Christian SchmitzFMK2017 - MBS FileMaker Plugin by Christian Schmitz
FMK2017 - MBS FileMaker Plugin by Christian SchmitzVerein FM Konferenz
 
FMK2022 Neue Programmiertechniken von Adam Augusting
FMK2022 Neue Programmiertechniken von Adam AugustingFMK2022 Neue Programmiertechniken von Adam Augusting
FMK2022 Neue Programmiertechniken von Adam AugustingVerein FM Konferenz
 
FMK 2013, Tipps und Tricks FM Go, Robert Kaiser
FMK 2013, Tipps und Tricks FM Go, Robert KaiserFMK 2013, Tipps und Tricks FM Go, Robert Kaiser
FMK 2013, Tipps und Tricks FM Go, Robert KaiserVerein FM Konferenz
 
FMK 2013 Schnittstellen Datenaustausch, Longin Ziegler
FMK 2013 Schnittstellen Datenaustausch, Longin ZieglerFMK 2013 Schnittstellen Datenaustausch, Longin Ziegler
FMK 2013 Schnittstellen Datenaustausch, Longin ZieglerVerein FM Konferenz
 
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Andreas Wissel
 
FMK2016 - Marcel Moré - The Power of SVG
FMK2016 - Marcel Moré - The Power of SVGFMK2016 - Marcel Moré - The Power of SVG
FMK2016 - Marcel Moré - The Power of SVGVerein FM Konferenz
 
FMK2018- Anforderungen einer Standardsoftware Karsten Risseeuw
FMK2018- Anforderungen einer Standardsoftware Karsten RisseeuwFMK2018- Anforderungen einer Standardsoftware Karsten Risseeuw
FMK2018- Anforderungen einer Standardsoftware Karsten RisseeuwVerein FM Konferenz
 
FMK2017 - Wordpress und FileMaker by Karsten Risseeuw
FMK2017 - Wordpress und FileMaker by Karsten RisseeuwFMK2017 - Wordpress und FileMaker by Karsten Risseeuw
FMK2017 - Wordpress und FileMaker by Karsten RisseeuwVerein FM Konferenz
 

Similar to FMK2022 Arbeiten mit SVG in FileMaker - Robert Kaiser (20)

FMK2022 FileMaker und Javascript von Adam Augustin
FMK2022 FileMaker und Javascript von Adam AugustinFMK2022 FileMaker und Javascript von Adam Augustin
FMK2022 FileMaker und Javascript von Adam Augustin
 
FMK2015: Von Skriptparametern Variablen und Globalen by Patrick Risch
FMK2015: Von Skriptparametern Variablen und Globalen by Patrick RischFMK2015: Von Skriptparametern Variablen und Globalen by Patrick Risch
FMK2015: Von Skriptparametern Variablen und Globalen by Patrick Risch
 
FMK2022 Die Zukunft von FileMaker - Marcel Moré.pdf
FMK2022 Die Zukunft von FileMaker - Marcel Moré.pdfFMK2022 Die Zukunft von FileMaker - Marcel Moré.pdf
FMK2022 Die Zukunft von FileMaker - Marcel Moré.pdf
 
FMK2017 - GUI Tipps für mobile Lösungen by Robert Kaiser
FMK2017 - GUI Tipps für mobile Lösungen by Robert KaiserFMK2017 - GUI Tipps für mobile Lösungen by Robert Kaiser
FMK2017 - GUI Tipps für mobile Lösungen by Robert Kaiser
 
FMK2022 FileMaker DataAPI und Java von Bernhard Schulz
FMK2022 FileMaker DataAPI und Java von Bernhard SchulzFMK2022 FileMaker DataAPI und Java von Bernhard Schulz
FMK2022 FileMaker DataAPI und Java von Bernhard Schulz
 
FMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang Wunderlich
FMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang WunderlichFMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang Wunderlich
FMK2015: FrameWork Konzepte in FileMaker Pro by Wolfgang Wunderlich
 
FMK2016 - Christian Schmitz - MBS FileMaker Plugin
FMK2016 - Christian Schmitz - MBS FileMaker PluginFMK2016 - Christian Schmitz - MBS FileMaker Plugin
FMK2016 - Christian Schmitz - MBS FileMaker Plugin
 
FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...
FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...
FMK2014: Custom Web Publishing (mit PHP) und WebDirect in einer Lösung by Mar...
 
FMK2018- Web direct fuer Einsteiger Alexis Gehrt
FMK2018- Web direct fuer Einsteiger Alexis GehrtFMK2018- Web direct fuer Einsteiger Alexis Gehrt
FMK2018- Web direct fuer Einsteiger Alexis Gehrt
 
FMK2015: The Power of JavaScript by Marcel Moré
FMK2015: The Power of JavaScript by Marcel MoréFMK2015: The Power of JavaScript by Marcel Moré
FMK2015: The Power of JavaScript by Marcel Moré
 
FMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen Kalender
FMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen KalenderFMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen Kalender
FMK2016 - Longin Ziegler - Schritt für Schritt zum eigenen Kalender
 
FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...
FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...
FMK2017 - Das FileMaker Selector-Connector Modell - Wie kann ich es sinnvoll ...
 
FMK2017 - MBS FileMaker Plugin by Christian Schmitz
FMK2017 - MBS FileMaker Plugin by Christian SchmitzFMK2017 - MBS FileMaker Plugin by Christian Schmitz
FMK2017 - MBS FileMaker Plugin by Christian Schmitz
 
FMK2022 Neue Programmiertechniken von Adam Augusting
FMK2022 Neue Programmiertechniken von Adam AugustingFMK2022 Neue Programmiertechniken von Adam Augusting
FMK2022 Neue Programmiertechniken von Adam Augusting
 
FMK 2013, Tipps und Tricks FM Go, Robert Kaiser
FMK 2013, Tipps und Tricks FM Go, Robert KaiserFMK 2013, Tipps und Tricks FM Go, Robert Kaiser
FMK 2013, Tipps und Tricks FM Go, Robert Kaiser
 
FMK 2013 Schnittstellen Datenaustausch, Longin Ziegler
FMK 2013 Schnittstellen Datenaustausch, Longin ZieglerFMK 2013 Schnittstellen Datenaustausch, Longin Ziegler
FMK 2013 Schnittstellen Datenaustausch, Longin Ziegler
 
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
 
FMK2016 - Marcel Moré - The Power of SVG
FMK2016 - Marcel Moré - The Power of SVGFMK2016 - Marcel Moré - The Power of SVG
FMK2016 - Marcel Moré - The Power of SVG
 
FMK2018- Anforderungen einer Standardsoftware Karsten Risseeuw
FMK2018- Anforderungen einer Standardsoftware Karsten RisseeuwFMK2018- Anforderungen einer Standardsoftware Karsten Risseeuw
FMK2018- Anforderungen einer Standardsoftware Karsten Risseeuw
 
FMK2017 - Wordpress und FileMaker by Karsten Risseeuw
FMK2017 - Wordpress und FileMaker by Karsten RisseeuwFMK2017 - Wordpress und FileMaker by Karsten Risseeuw
FMK2017 - Wordpress und FileMaker by Karsten Risseeuw
 

More from Verein FM Konferenz

FMK2022 Excel und FileMaker Schittko.pdf
FMK2022 Excel und FileMaker Schittko.pdfFMK2022 Excel und FileMaker Schittko.pdf
FMK2022 Excel und FileMaker Schittko.pdfVerein FM Konferenz
 
FMK2022 Drucken über Dateigrenzen hinweg von Philipp Puls
FMK2022 Drucken über Dateigrenzen hinweg von Philipp PulsFMK2022 Drucken über Dateigrenzen hinweg von Philipp Puls
FMK2022 Drucken über Dateigrenzen hinweg von Philipp PulsVerein FM Konferenz
 
FMK2022 Custom Functions von Philipp Puls
FMK2022 Custom Functions von Philipp PulsFMK2022 Custom Functions von Philipp Puls
FMK2022 Custom Functions von Philipp PulsVerein FM Konferenz
 
FMK2022 FileMaker Fehler von Martin Schwarz
FMK2022 FileMaker Fehler von Martin SchwarzFMK2022 FileMaker Fehler von Martin Schwarz
FMK2022 FileMaker Fehler von Martin SchwarzVerein FM Konferenz
 
FMK2022 FileMaker Server unter Linux Workshop von Bernhard Schulz
FMK2022 FileMaker Server unter Linux Workshop von Bernhard SchulzFMK2022 FileMaker Server unter Linux Workshop von Bernhard Schulz
FMK2022 FileMaker Server unter Linux Workshop von Bernhard SchulzVerein FM Konferenz
 
FMK2022 Dokumentation - Thomas Hirt
FMK2022 Dokumentation - Thomas HirtFMK2022 Dokumentation - Thomas Hirt
FMK2022 Dokumentation - Thomas HirtVerein FM Konferenz
 
FMK2022 CustomFunctions Fuer Einsteiger - Thomas Hirt
FMK2022 CustomFunctions Fuer Einsteiger - Thomas HirtFMK2022 CustomFunctions Fuer Einsteiger - Thomas Hirt
FMK2022 CustomFunctions Fuer Einsteiger - Thomas HirtVerein FM Konferenz
 
FMK2022 FileMaker Integrated Development Environment - Russell Watson
FMK2022 FileMaker Integrated Development Environment - Russell WatsonFMK2022 FileMaker Integrated Development Environment - Russell Watson
FMK2022 FileMaker Integrated Development Environment - Russell WatsonVerein FM Konferenz
 
FMK2022 Datenschutz DSGVO Christoph Kluss
FMK2022 Datenschutz DSGVO Christoph KlussFMK2022 Datenschutz DSGVO Christoph Kluss
FMK2022 Datenschutz DSGVO Christoph KlussVerein FM Konferenz
 
FMK2022 Rechnungen Inkasso - Christoph Kluss
FMK2022 Rechnungen Inkasso - Christoph KlussFMK2022 Rechnungen Inkasso - Christoph Kluss
FMK2022 Rechnungen Inkasso - Christoph KlussVerein FM Konferenz
 
FMK2019 bug off lightning talk by Russell Watson
FMK2019 bug off lightning talk by Russell WatsonFMK2019 bug off lightning talk by Russell Watson
FMK2019 bug off lightning talk by Russell WatsonVerein FM Konferenz
 
FMK2019 being an optimist in a pessimistic world by vincenzo menanno
FMK2019 being an optimist in a pessimistic world by vincenzo menannoFMK2019 being an optimist in a pessimistic world by vincenzo menanno
FMK2019 being an optimist in a pessimistic world by vincenzo menannoVerein FM Konferenz
 
FMK2019 FileMaker Performance Update 2019 by HOnza Koudelka
FMK2019 FileMaker Performance Update 2019 by HOnza KoudelkaFMK2019 FileMaker Performance Update 2019 by HOnza Koudelka
FMK2019 FileMaker Performance Update 2019 by HOnza KoudelkaVerein FM Konferenz
 
FMK2019 Hardware Integrated by HOnza Koudelka
FMK2019 Hardware Integrated by HOnza KoudelkaFMK2019 Hardware Integrated by HOnza Koudelka
FMK2019 Hardware Integrated by HOnza KoudelkaVerein FM Konferenz
 
Fmk2019 Produktentwicklung mit FileMaker by Harald Mair
Fmk2019 Produktentwicklung mit FileMaker by Harald MairFmk2019 Produktentwicklung mit FileMaker by Harald Mair
Fmk2019 Produktentwicklung mit FileMaker by Harald MairVerein FM Konferenz
 
FMK2019 FileMaker Data API mit Node.js nutzen by Adam Augustin
FMK2019 FileMaker Data API mit Node.js nutzen by Adam AugustinFMK2019 FileMaker Data API mit Node.js nutzen by Adam Augustin
FMK2019 FileMaker Data API mit Node.js nutzen by Adam AugustinVerein FM Konferenz
 
FMK2019 Layout und Eigene Menüs-Management by Jörg Köster
FMK2019 Layout und Eigene Menüs-Management  by Jörg KösterFMK2019 Layout und Eigene Menüs-Management  by Jörg Köster
FMK2019 Layout und Eigene Menüs-Management by Jörg KösterVerein FM Konferenz
 
FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens ...
FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens  ...FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens  ...
FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens ...Verein FM Konferenz
 
FMK2019 FM Data Migration Tool by Stefan Tischler
FMK2019 FM Data Migration Tool by Stefan TischlerFMK2019 FM Data Migration Tool by Stefan Tischler
FMK2019 FM Data Migration Tool by Stefan TischlerVerein FM Konferenz
 
FMK2019 dot-Net-Plugin selbst programmieren by Werner Staub
FMK2019 dot-Net-Plugin selbst programmieren by Werner StaubFMK2019 dot-Net-Plugin selbst programmieren by Werner Staub
FMK2019 dot-Net-Plugin selbst programmieren by Werner StaubVerein FM Konferenz
 

More from Verein FM Konferenz (20)

FMK2022 Excel und FileMaker Schittko.pdf
FMK2022 Excel und FileMaker Schittko.pdfFMK2022 Excel und FileMaker Schittko.pdf
FMK2022 Excel und FileMaker Schittko.pdf
 
FMK2022 Drucken über Dateigrenzen hinweg von Philipp Puls
FMK2022 Drucken über Dateigrenzen hinweg von Philipp PulsFMK2022 Drucken über Dateigrenzen hinweg von Philipp Puls
FMK2022 Drucken über Dateigrenzen hinweg von Philipp Puls
 
FMK2022 Custom Functions von Philipp Puls
FMK2022 Custom Functions von Philipp PulsFMK2022 Custom Functions von Philipp Puls
FMK2022 Custom Functions von Philipp Puls
 
FMK2022 FileMaker Fehler von Martin Schwarz
FMK2022 FileMaker Fehler von Martin SchwarzFMK2022 FileMaker Fehler von Martin Schwarz
FMK2022 FileMaker Fehler von Martin Schwarz
 
FMK2022 FileMaker Server unter Linux Workshop von Bernhard Schulz
FMK2022 FileMaker Server unter Linux Workshop von Bernhard SchulzFMK2022 FileMaker Server unter Linux Workshop von Bernhard Schulz
FMK2022 FileMaker Server unter Linux Workshop von Bernhard Schulz
 
FMK2022 Dokumentation - Thomas Hirt
FMK2022 Dokumentation - Thomas HirtFMK2022 Dokumentation - Thomas Hirt
FMK2022 Dokumentation - Thomas Hirt
 
FMK2022 CustomFunctions Fuer Einsteiger - Thomas Hirt
FMK2022 CustomFunctions Fuer Einsteiger - Thomas HirtFMK2022 CustomFunctions Fuer Einsteiger - Thomas Hirt
FMK2022 CustomFunctions Fuer Einsteiger - Thomas Hirt
 
FMK2022 FileMaker Integrated Development Environment - Russell Watson
FMK2022 FileMaker Integrated Development Environment - Russell WatsonFMK2022 FileMaker Integrated Development Environment - Russell Watson
FMK2022 FileMaker Integrated Development Environment - Russell Watson
 
FMK2022 Datenschutz DSGVO Christoph Kluss
FMK2022 Datenschutz DSGVO Christoph KlussFMK2022 Datenschutz DSGVO Christoph Kluss
FMK2022 Datenschutz DSGVO Christoph Kluss
 
FMK2022 Rechnungen Inkasso - Christoph Kluss
FMK2022 Rechnungen Inkasso - Christoph KlussFMK2022 Rechnungen Inkasso - Christoph Kluss
FMK2022 Rechnungen Inkasso - Christoph Kluss
 
FMK2019 bug off lightning talk by Russell Watson
FMK2019 bug off lightning talk by Russell WatsonFMK2019 bug off lightning talk by Russell Watson
FMK2019 bug off lightning talk by Russell Watson
 
FMK2019 being an optimist in a pessimistic world by vincenzo menanno
FMK2019 being an optimist in a pessimistic world by vincenzo menannoFMK2019 being an optimist in a pessimistic world by vincenzo menanno
FMK2019 being an optimist in a pessimistic world by vincenzo menanno
 
FMK2019 FileMaker Performance Update 2019 by HOnza Koudelka
FMK2019 FileMaker Performance Update 2019 by HOnza KoudelkaFMK2019 FileMaker Performance Update 2019 by HOnza Koudelka
FMK2019 FileMaker Performance Update 2019 by HOnza Koudelka
 
FMK2019 Hardware Integrated by HOnza Koudelka
FMK2019 Hardware Integrated by HOnza KoudelkaFMK2019 Hardware Integrated by HOnza Koudelka
FMK2019 Hardware Integrated by HOnza Koudelka
 
Fmk2019 Produktentwicklung mit FileMaker by Harald Mair
Fmk2019 Produktentwicklung mit FileMaker by Harald MairFmk2019 Produktentwicklung mit FileMaker by Harald Mair
Fmk2019 Produktentwicklung mit FileMaker by Harald Mair
 
FMK2019 FileMaker Data API mit Node.js nutzen by Adam Augustin
FMK2019 FileMaker Data API mit Node.js nutzen by Adam AugustinFMK2019 FileMaker Data API mit Node.js nutzen by Adam Augustin
FMK2019 FileMaker Data API mit Node.js nutzen by Adam Augustin
 
FMK2019 Layout und Eigene Menüs-Management by Jörg Köster
FMK2019 Layout und Eigene Menüs-Management  by Jörg KösterFMK2019 Layout und Eigene Menüs-Management  by Jörg Köster
FMK2019 Layout und Eigene Menüs-Management by Jörg Köster
 
FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens ...
FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens  ...FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens  ...
FMK2019 FileMaker – das Lizenzmodell Alles was Sie wissen wollen by Klemens ...
 
FMK2019 FM Data Migration Tool by Stefan Tischler
FMK2019 FM Data Migration Tool by Stefan TischlerFMK2019 FM Data Migration Tool by Stefan Tischler
FMK2019 FM Data Migration Tool by Stefan Tischler
 
FMK2019 dot-Net-Plugin selbst programmieren by Werner Staub
FMK2019 dot-Net-Plugin selbst programmieren by Werner StaubFMK2019 dot-Net-Plugin selbst programmieren by Werner Staub
FMK2019 dot-Net-Plugin selbst programmieren by Werner Staub
 

FMK2022 Arbeiten mit SVG in FileMaker - Robert Kaiser

  • 1. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Ein Vortrag von Robert Kaiser FileMaker und SVG-Grafiken
  • 2. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Robert Kaiser – karo.at Robert Kaiser • zertifizierter FileMaker Entwickler (10 bis 19) • Claris Partner • Werbegrafiker seit 1993 • FileMaker Entwicklung seit 1996 • Autor für FileMaker Magazin • Sprecher auf der FileMaker Konferenz 
 2012, 2013, 2016, 2017
  • 3. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Robert Kaiser – karo.at karo productions • individuelle Lösungen auf der Basis von 
 FileMaker Pro/Go/WebDirect • DTP-Workflow-Optimierung • Schulungen (Adobe InDesign, Photoshop, u.a.) • FMM Award 2014, Beste FileMaker Lösung
  • 4. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Agenda • Was ist SVG? • Datenbank für Aufbau von Vorlagen • Tipps für FileMaker Berechnungen • Beispiele aus der Praxis
  • 5. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Ziel • Potential von SVG aufzuzeigen,
 auch ohne Bibliotheken und JavaScript
  • 6. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Nützliche Vorkenntnisse für diesen Vortrag • FileMaker Webviewer • Grundkenntnisse in HTML, XML, CSS • Aber keine JavaScript-Kenntnisse nötig!
  • 7. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Zum Nachlesen mit vielen Beispielen: FMK 2016: 
 Award-Winner Marcel Moré – The Power of SVG Empfehlung
  • 8. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Was ist SVG?
  • 9. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Definition laut Wikipedia: „Scalable Vector Graphics (kurz auch SVG, englisch für skalierbare Vektorgrafik) ist die vom World Wide Web Consortium (W3C) empfohlene Spezifikation zur Beschreibung zweidimensionaler Vektorgrafiken. SVG, das auf XML basiert, wurde erstmals im September 2001 veröffentlicht. Praktisch alle relevanten Webbrowser können einen Großteil des Sprachumfangs darstellen.“ Was ist SVG?
  • 10. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Das bedeutet: • Ist schon lange Web-Standard -> Läuft somit auch mit alter Browser Engine • Ist Vektorgrafik, somit skalierbar -> im Gegensatz zu Pixel-Bildformaten wie JPEG oder PNG • Basiert auf XML, also Text -> können wir mit FileMaker Textfunktionen erzeugen oder manipulieren Was ist SVG?
  • 11. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Textcode, der im Browser oder Zielprogramm gerendert wird: Was ist SVG? Ausgabe im Browser oder Webviewer:
  • 12. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Auch Symbole bei den Tasteneinstellungen sind SVG: Was ist SVG?
  • 13. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Beispiele für Applikationen, um komplexere Grafiken zu erstellen: • Sketch • Adobe Illustrator
 Was ist SVG?
  • 14. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Beispieldatenbank:
 Grundsätzlicher Aufbau 
 mit Webviewer in FileMaker
  • 15. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Problemstellung aus der Praxis (Druckerei)
  • 16. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Erster Einsatz von SVG: • Relaunch Maschinen-Belegungsplan: Alte Lösung noch mit FileMaker-Plugin, die nicht gut funktioniert hat, 
 bzw. schwer zu pflegen war. • Neue Lösung: Umgesetzt noch mit 8 Webviewer, daneben FileMaker-Buttons, Portale, … Guter Einstieg, war aber weder elegant noch flexibel. Problemstellung aus der Praxis
  • 17. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Neue Vorgabe: Erweiterte Integration in Tagesplan: • Belegungspläne, die darstellen, welche Mitarbeiter auf welcher Maschine an welcher Produktion arbeiten soll • war weder mit Portalen, Wiederholfelder, oder Tastenleisten gut zu realisieren • Nicht nur zur Ansicht, sondern soll auch Planungstool werden -> Interaktion muss möglich sein • Aus Erfahrung wird Funktionalität laufend erweitert bzw. angepasst Problemstellung aus der Praxis
  • 18. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Überlegung für Relaunch • Weiter auf SVG setzen? • Bestärkt durch Anregungen im Vortrag Marcel Moré auf der FMK 2016 Tolle Beispiele von Grafiken (Bibliotheken) • Ernüchterung Die benötigten Beispiele und Bibliotheken haben 
 unter Windows FM17 nicht funktioniert • Entwicklung in JavaScript? keine ausreichenden JavaScript Kenntnisse Problemstellung aus der Praxis
  • 19. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Nach Tests wurde folgender Lösungsansatz gewählt: • HTML und SVG Code wird mit FileMaker Scripts berechnet! Problemstellung aus der Praxis
  • 20. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Grundsätzlich Aufbau: • Ein Webviewer, HTML Seite mit einer SVG Grafik wird ausgegeben • Über verschiedene Bausteine wird die SVG Grafik mit FileMaker Bordmittel befüllt (Platzhalter für Positionen, Stile und Inhalte austauschen) • Formatierung mit CSS, lokale Formatierung soll möglich sein 
 (z.B. Farben) Problemstellung aus der Praxis
  • 21. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Für die unterschiedlichen Objekte gibt es je eine Vorlage: • Baustein Text (Beschriftungen) • Baustein Fläche (für Hintergründe) • Baustein Linie (für Darstellung Zeitachsen) • Baustein Text + Fläche • Baustein Text + Fläche mit URL • … Problemstellung aus der Praxis
  • 22. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Beispieldatenbank:
 Austauschen von Bausteinen
  • 23. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Vergleich FM Ansatz / JavaScript
  • 24. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Code-Berechnung mit FileMaker Bordmittel: • Datensammlung und Gliederung in FM • Berechnung der Ausgabe (Positionen, Anzeigen) in FM Vorteile • Business Logik in FM
 -> Debuggen und Wartung in FileMaker Script! • es müssen keine Bibliotheken geladen oder gewartet werden • Funktioniert auch mit älteren FileMaker Clients Nachteile • Klick, bzw. Statusänderung (Objekt selektiert) 
 -> erneutes Rendern des ganzen Webviewers Vergleich FM Ansatz / JavaScript
  • 25. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Code-Berechnung in JavaScript: • Datensammlung und Gliederung in FM • Berechnung der Ausgabe (Positionen, Anzeigen) in JS Vorteile • „Business Logik“ in JS (was passiert bei Klick, 
 welche Daten werden übergeben, etc)
 -> Allerdings debuggen und Wartung in JavaScript! • Datenaktualisierung (ab FM19) möglich -> Logik in JS • Drag & Drop, Animationen etc. möglich Nachteile • eventuell JS-Bibliotheken laden und pflegen • Kompatibilität zu älteren FileMaker Clients Vergleich FM Ansatz / JavaScript
  • 26. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Beispieldatenbank:
 Interaktion
  • 27. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Praxisbeispiele
  • 28. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at FileMaker Tipps
  • 29. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Speicherort der Code-Snippets (Bausteine) • Vermeiden von global gespeicherten Feldern (für Serverlösungen, Ausnahme ist Zwischenspeichern der geladenen Einstellungen) • Entweder direkt in Variablen ablegen oder vor ersten Ausgabe des Webviewers aus Tabelle laden • Ziel ist einfache Wartbarkeit des Codes und der Snippets FileMaker Tipps
  • 30. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Webviewer Code berechnen (bei sehr viel Text) • Verwende den Scriptschritt "Berechneten Wert einfügen" 
 (ist schneller als Variable setzen mit Listenfunktion) • Austauschen-Funktionen: Reihenfolge beachten (zuerst Platzhalter mit wenig Text ersetzen, z.B. CSS oder Hintergrundfarben, am Ende den größten Baustein) • Kompromiss finden zwischen optimierten Code 
 (wenige Scriptschritte) und Wartbarkeit / Lesbarkeit FileMaker Tipps
  • 31. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Daten für Webviewer • Strategie für Datenselektion bzw. Zwischenspeicherung überlegen • Eventuell Daten bereits als JSON Objekt bereithalten, falls die Ausgabe oder Manipulation später doch über JavaScript erfolgt
 Achtung bei mehreren bzw. großen JSON Objekten: 
 Es liegt immer nur ein JSON Objekt optimiert im Speicher vor! FileMaker Tipps
  • 32. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Datenänderung • Beachten beim Zurückschreiben, dass die Daten nach dem Renderzeitpunkt vielleicht geändert wurden. Sondertasten • Nicht alle Sondertasten funktionieren auf beiden Plattformen 
 (macOS: keine control-Taste; Windows: keine Shift-Taste) 
 (keine Alt-Taste und Citrix) Trigger OnLayoutTastenDruck • Unter Windows darf Fokus nicht im Webviewer sein, damit Tastendruck Trigger ordnungsgemäß funktionieren FileMaker Tipps
  • 33. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Fragen?
  • 34. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Vielen Dank für Ihr Interesse!
  • 35. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Weiterführende Links Vortrag FMK 2016: • Marcel Moré - The Power of SVG
 https://blog.marcel-more.de/2016/10/14/the-power-of-svg/ Mehr über SVG • SVG Definition Wikipedia
 https://de.wikipedia.org/wiki/Scalable_Vector_Graphics • Selfhtml
 https://wiki.selfhtml.org/wiki/SVG Hilfsmittel für Grafik-Erstellung • Sketch
 https://www.sketch.com
  • 36. FileMaker Konferenz | Hamburg | 22.-24. Juni 2022 FileMaker und SVG-Grafiken | Robert Kaiser, www.karo.at Vielen Dank unseren Sponsoren Danke für das Bewerten dieses Vortrages