2013-03-22 6 views
24

Ho bisogno di creare un diagramma davvero complicato per un sito web, in cui la gerarchia sarà un po 'caotica: le frecce andranno su e giù, a volte un elemento punterà a molti altri, e a volte ci saranno diversi elementi che puntano allo stesso. Ho trovato this method, ma non consente più di un genitore per un elemento e quindi non farà il trucco in questo caso.Come creare un diagramma di flusso/diagramma usando solo HTML e CSS

Deve essere fatto in HTML/CSS, perché la mia intenzione è quella di aggiungere alcuni Javascript per modificare dinamicamente il contenuto dei blocchi.

Questo è un esempio del livello di complessità che ho bisogno di ottenere: chart

+0

Tutti questi elementi possono essere creati e posizionati in puro HTML/CSS utilizzando tag, pseudoelementi (come ': before'), trasformazioni css3 e posizionamento assoluto, ma tieni presente che non sarà molto trasversale soluzione browser e ci vorrà sicuramente molto lavoro. :) –

+3

hai guardato questo http://astuteo.com/slickmap/ è lo stesso affare? non ho davvero provato il – btevfik

+0

@nd_macias La tua soluzione sembra solida. Tuttavia, non penso di non avere né il tempo né le capacità CSS per farlo in quel modo. Dovrò continuare a cercare. Grazie comunque. – Variax

risposta

2

altro da cercare è SpaceTree example da "Nicolas Garcia Belmonte" ma non una pura soluzione CSS. È compatibile con IE e la maggior parte dei browser. Sicuramente vale la pena provare.

+0

Ok, posso chiedere alla persona fantastica che dice che non è stato utile? può (s) per favore ci ha detto perché (s) pensa che questo non è stato utile? Ho realizzato un piccolo progetto usando questo ed è stato molto divertente lavorare con questo. Sono d'accordo che non è super flessibile, ma può essere modificato in base alle proprie esigenze. –