64 votes

Sont-il mieux javascript organigrammes en comparaison avec Google organigramme de l'API?

Nous sommes à l'aide de google organigramme de l'API pour afficher nos organigrammes. Cela fonctionne bien, mais nous avons besoin de quelque chose qui prend en charge:

  1. Une personne de rapports de plusieurs gestionnaires
  2. Co chefs de domaines fonctionnels.

Existe-il des outils concurrents qui donnent un meilleur support pour les ci-dessus.


REMARQUE: Pour Gorka llona a, qui a suggéré cette solution ci-dessous dans l'une des réponses, j'ai trouvé quelques bugs, voici une capture d'écran de la question, je suis en cours d'exécution à l'aide de votre exemple de test.

enter image description here

26voto

Beau Points 3353

Vous pouvez utiliser Jit (Le JavaScript Infoviz Toolkit), il y a un bon exemple ici. C'est ce que j'ai utilisé pour créer un organigramme hiérarchique dans mon entreprise (soutenu par un script PHP qui tourne AD relations en JSON).

26voto

James Westgate Points 6789

D3 - http://d3js.org/

Voici un exemple - ils sont un peu dur à trouver

http://bl.ocks.org/1061834

18voto

aug Points 1987

Vous ne savez pas si vous êtes toujours à la recherche considérant que c'est 2 ans, mais je suis dans la même situation et trouvé ceci:

yFILES http://live.yworks.com/yfiles-for-html/1.1/demos/Complete/demo.yfiles.graph.orgchart/index.html

Certains autres ceux que j'ai trouvés:

jOrgChart http://dl.dropboxusercontent.com/u/4151695/html/jOrgChart/example/example.html

Organisation des Graphiques à l'aide JS http://jvloenen.home.xs4all.nl/orgchart/

J'ai fini par utiliser D3.js de le faire. J'utilise leur TreeLayout et modifié pour l'adapter à mes besoins. Voici un exemple de code:

var tree = d3.layout.tree().nodeSize([70, 40]);
var diagonal = d3.svg.diagonal()
    .projection(function (d) {
    return [d.x + rectW / 2, d.y + rectH / 2];
});

var svg = d3.select("#body").append("svg").attr("width", 1000)
    .attr("height", 1000).append("g")
    .attr("transform", "translate(" + 350 + "," + 20 + ")");

Voici un jsFiddle de ce que j'ai commencé: http://jsfiddle.net/augburto/YMa2y/

6voto

Horatio Alderaan Points 1635

En bref @Cam est vrai, mais vous n'avez pas nécessairement besoin de regarder Silverlight ou Flash. Je recommande à la recherche dans le Raphael.js de la bibliothèque. C'est un niveau plus bas que ce que vous semblez être après, mais l'API est assez simple.

En particulier, la Graffle exemple serait un bon endroit pour commencer.

4voto

Gorka G LLona Points 71

Pour ceux qui recherchent un moyen simple, Javascript open-source organigramme de la bibliothèque:

J'ai juste publié lib_gg_orgchart. Il utilise un JSON entrée et dessine le graphique à l'aide de Raphaël.

Cette bibliothèque répond à des exigences de #1 et #2 de la question d'origine.

Jetez un oeil sur le site pour voir quelques exemples et télécharger:

http://librerias.logicas.org/lib_gg_orgchart/index.html

Si vous le trouvez utile, s'il vous plaît laissez-moi savoir.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X