Ich bin auf ein seltsames Problem gestoßen, das ich nicht beheben kann. In meinen Diagrammen fehlen die X- und Y-Achsenlinien, und im Tooltip-Feld wird nur der Text und nicht die Box selbst angezeigt.Fehlende Gitternetzlinien mit nvd3-ng2
Ich testete dies sogar mit nur dem Beispiel diskreten Balkendiagramm aus dem Abschnitt "Grundlegende Verwendung" der Readme bei ng2-nvd3 Github-Seite.
Irgendwelche Ideen, was das verursacht? Ich habe eine sehr einfache eckige2 Seite eingerichtet, mit minimalen Stilen außer Bootstrap und sehr minimalem HTML. Selbst wenn alle Stile entfernt wurden, besteht das Problem weiterhin.
Alles andere mit dem Diagramm funktioniert perfekt.
Screenshot showing problems with sample bar chart from readme
Die D196.5 auf der Oberseite des hellbraunen bar ist der Tooltip. Wie Sie sehen können, fehlen alle Gitternetzlinien und das Tooltip-Feld.
Hier ist eine Beispielanwendung, wenn jemand das Problem testen möchte sich: https://github.com/ekuusi/nvd3-ng2-grid-issue
Die Beispielanwendung ist ein minimales MEAN Projekt, das das Problem zeigt. Um das Projekt auszuführen:
- Kopie in einen lokalen Ordner
- npm installieren
- npm Lauf
- npm bauen beginnen
Die App hört auf localhost: 3000. Die App hat nur eine Ansicht mit Hello World und das Balkendiagramm, das das Problem darstellt.
EDIT: Gelöst, aber ich werde dies hier lassen, wenn jemand auf das gleiche Problem läuft. Sie können auch das hier verlinkte Repo verwenden, wenn Sie sehen möchten, wie ng2-nvd3 in einem Angular 2-Projekt mit Webpack funktioniert.