Det finns ingen diagramfunktion i FileMaker och otaliga är de lösningar där man försöker göra diagram på bästa sätt, t.ex. med repeterade fält, portaler, beräkningsfunktioner etc. Det finns externa lösningar också, allt från Flash-baserade webbvisartillägg till internetbaserade varianter som Google Chart.
Med FileMaker Pro 9 går det att använda HTML-kod direkt i webvisaren, utan någon behov av några extern lösningar. Jag ska visa hur man kan göra ett enkelt stapeldiagram med några rader kod. Du gör hela diagrammet i ett beräkningsfält som returnerar fälttypen Text.
Jag vill göra ett stapeldiagram med 4 staplar och har fyra numeriska fält i en FileMaker-tabell, Värde1, Värde2, Värde3 och Värde4. I beräkningsfältet beräknar jag först en skalfaktor för värdena så att de fyller hela webvisaren och sedan sätter jag in värdena i en HTML-kodsnutt som ska visas i en webvisare. Nyckeln till att det fungerar utan externa filer är möjligheten att ange koden ”data:text/html,” först i beräkningsfältet. Det talar om för FileMaker att tolka innehållet i fältet som HTML-kod.
Formeln ser ut så här. Du kan skriva formeln direkt i webvisarens definition:
"data:text/html," &Let( [max = Max(Tabell::Värde1; Tabell::Värde2; Tabell::Värde3; Tabell::Värde4); höjd_1 = Round(Tabell::Värde1 / max; 2); höjd_2 = Round(Tabell::Värde2 / max; 2); höjd_3 = Round(Tabell::Värde3 / max; 2); höjd_4 = Round(Tabell::Värde4 / max; 2)];
"<html> <head> <style>div { background: red; position: absolute; width: 20%; bottom: 0; float: left; text-align: center; font-family: Verdana; }</style> <body style=\"border: 0; margin: 0;\"> <div style=\"left: 0; height: " & (höjd_1 100) & "%\"></div> <div style=\"left: 26%; height: " & (höjd_2 100) & "%\"></div> <div style=\"left: 52%; height: " & (höjd_3 100) & "%\"></div> <div style=\"left: 78%; height: " & (höjd_4 100) & "%\"></div> </body> </html>" )
Funktionen Max tar fram maxvärdet av de fyra värde-fälten som sedan används för att skala resterande värden. Det största värdet kommer att bli 100, de övriga mellan 0 och 100. Avrundning görs till 2 decimaler med funktionen Round.
I HTML-koden anger jag bakgrundsfärg och bredd på div-taggar i style-taggen. I respektive div-tag sätter jag sedan höjden på staplarna i enheten %.