Flowcharts in HTML

[DPLuS]

Recentelijk heb ik de opdracht gekregen om een website te maken waarin KPI's (http://en.wikipedia.org/wiki/Key_performance_indicators) moeten worden weergegeven in een "flowchart"-stijl.

Voorbeeld:



Nu is het maken van zoiets in Microsoft Visio een peuleschil, maar hoe krijg ik dit nu in HTML voorelkaar?

Op zich zou ik de hokjes als DIV'jes absoluut kunnen positioneren op mijn pagina, maar dan zit ik nog met de verbindingsstreepjes en pijltjes, ik wil eigenlijk zo min mogelijk plaatjes gebruiken.

Heeft iemand misschien een idee om bovenstaand scenario te bewerkstelligen?

[Toolskyn]

Volgens mij kun je in dit geval zoiets toch beter server side genereren als een plaatje, om dat vervolgens in een pagina te zetten, lijkt me niet echt makkelijk om dit enigsinds binnen de perken in een HTML document te zetten.

In dit geval zou SVG toch een uitkomst zijn, ware het niet dat Internet Explorer dat niet ondersteund.

[JKVA]

Ik kan wel een manier noemen, maar dat is waarschijnlijk is dat niet het gewenste antwoord:

Uitprogrammeren

Misschien dat je het met VML of SVG voor elkaar krijgt, anders denk ik dat het een flinke klus wordt.

Of misschien op de server met Java2D of GD library een image renderen en die tonen.

[rhodium]

daarvoor raad ik je echt jpgraph aan.

[FirmPete]

Je kan je visio opslaan als html, of denk ik nou te simpel?

[moozzuzz]

Ik zal es zoeken in mijn archief, ergens heb ik wel zoiets als een organigram dat er op lijkt.

[Verwijderd]

je kan wel een eind komen, maar of het opweegt tegen een plaatje met image map weet ik niet.

schuine lijnen kan in IE wel door het transform filter toe te passen op iets met alleen een bovenrand.
in Fx en opera kan je dat doen met svg (die dat standaard ondersteunen tegenwoordig)

Verder heb ik wel eens een organogram gemaakt met html: http://w3.tue.nl/nl/diens...isatie/organisatieschema/

dus het kan allemaal wel, maar gaat je wel wat moeite kosten

[DPLuS]

OK, nog even een toelichting: Statische HTML pagina is geen optie.
Dagelijks moet er namelijk gerapporteerd worden, dit zal dus allemaal dynamisch gegenereerd moeten worden.

Ik neig nu naar de kant van een plaatje server side genereren, platform dat ik hier tot mijn beschikking heb is Linux, Apache MySQL en PHP.
Wellicht dat ik met GD iets kan.

Alleen vraag ik me dan af hoe ik die imagemap moet genereren nadat ik een plaatje ge-output heb?

[MMUilwijk]

Je imagemap is natuurlijk niks anders dan HTML, welke je met PHP makkelijk kunt genereren. Kwestie van de juiste coordinaten pakken en dan dynamisch bepalen waar wat zit.

Ik heb voor een opdracht ook iets dergelijks moeten maken, toevallig ook met KPI's. Weliswaar in C#, maar in PHP kun je idd met GD leuke dingen doen. Serverside met Visio 2007 klooien kan natuurlijk ook ;-) Of anders met Flash?

[ Voor 18% gewijzigd door MMUilwijk op 20-06-2007 20:12 ]

[BikkelZ]

Aangezien een gerenderd plaatje al als een valide optie aanvaard wordt: Flash! Wat is er grafisch nou beter dan Flash voor zoiets?

Ik heb er sinds 5 geen serieuze blik meer op geworpen, maar volgens mij kunnen die laatste versies heel veel qua dynamische datauitwisseling en scripting.