dimple.js: Tool-Tipp-Platzierung in einem Diagramm eines verschachtelten Svg-Elements

Question

Ich versuche, Bullet Charts example von dimple.js mit jedem Bullet-Diagramm in einem Kind-Svg der Eltern-Svg zu ändern. Der Zweck der individuellen Svg für jedes Bullet-Diagramm ist es, ihre Verwaltung zu erleichtern (zeigen/verstecken/entfernen). Dies macht auch die rekursive Definition eines Diagramms vollständig - das heißt, ein Diagramm ist in einem Svg enthalten.

Die fiddle for the modified version is here....

Wie Sie sehen können, sind ab der 2. Chart mit dem Maus-Hover Werkzeugtipps fehl am Platz !!! Bitte beachten Sie, dass ich für Kind-Svg den Stil overflow: visible eingestellt habe, ohne den Tool-Tipps überhaupt nicht sichtbar waren.

Willst du wissen, ob mir etwas in der Handhabung der Attribute von Child-Svg-Elementen fehlt oder ist es ein Fehler in dimple.js. Bitte lassen Sie es mich wissen, wenn Sie eine Problemumgehung kennen.

Danke.

Answer 1

Eine der ersten Fragen, die ich habe, ist, warum Sie Kinder Svg Elemente wollen? Was versuchst du zu erreichen? Der einzige Unterschied, den ich in Ihrem Code und dem Beispiel sehe, ist die Höhe/Breite Swap an der Spitze und die Subsvg + Grenzen.

Beachten Sie, dass sich der Ursprung mit jeder Sub-Svg ändert. Dies könnte der Grund sein, warum Sie Probleme mit den Tooltips haben. Vielleicht hast du das in deinen Add-Bullet-Aufrufen verarbeitet.

Ich denke, dass nagu den richtigen Ansatz hier hat, wenn Sie wirklich getrennte SVG-Elemente wollen.