Erstellen Sie eine D3-Achse ohne Hilfsstrichbeschriftungen

7

Wie kann ich eine D3 axis erstellen, die keine Markierungen an ihren Häkchen hat ?

Hier ist ein Beispiel, das zeigt, was ich suche , von Mike Bostock nicht weniger. Es gibt mehrere Axis-Objekte, die um das Zentrum gedreht sind und nur die erste hat Tick-Labels.

In diesem Fall hat er das Ergebnis mit CSS erreicht, um alle außer den Beschriftungen der ersten Achse zu verbergen:

%Vor%

Dies führt jedoch immer noch zur Erstellung von SVG text -Elementen im DOM. Gibt es eine Möglichkeit, ihre Entstehung gänzlich zu vermeiden?

    
Drew Noakes 05.11.2013, 11:27
quelle

2 Antworten

6

Sie können die Erzeugung der Elemente text nicht vermeiden, ohne die Quelle zu ändern. Sie können diese Elemente jedoch entfernen, nachdem sie generiert wurden:

%Vor%

Insgesamt ist dies wahrscheinlich der flexibelste Weg, um dies zu erreichen, da Sie Etiketten auch selektiv entfernen können. Sie können die Daten, die verwendet werden, um sie zu generieren, von der verwendeten Skala abrufen (indem Sie scale.ticks() aufrufen), was es Ihnen leicht machen würde, Dinge wie alle ungeraden Beschriftungen zu entfernen.

    
Lars Kotthoff 05.11.2013, 15:16
quelle
26

Ich werde das hier einfach hier lassen, da die Leute wahrscheinlich zu dieser Frage kommen werden. Hier sind die verschiedenen Möglichkeiten, wie Sie eine D3-Achse einfach manipulieren können

  • Ohne irgendwelche Häkchen oder Hilfsstriche:

    %Vor%

    Keine line oder text Elemente werden auf diese Weise erstellt.

  • Ohne Häkchen und mit Häkchen:

    %Vor%

    Die Elemente line werden immer noch auf diese Weise erstellt.

    Sie können den Abstand zwischen den Hilfsstrichbeschriftungen und der Achse beispielsweise mit .tickPadding(10) vergrößern.

  • Mit Häkchen und ohne Häkchen:

    %Vor%

    Die Elemente text werden immer noch auf diese Weise erstellt.

Ashitaka 11.11.2014 11:26
quelle

Tags und Links