Chart.js 2.2.1 - Chart nicht korrekt dargestellt, bevor

Question

Ändern der Größe Wie der Titel schon sagt, meine Charts machen nicht korrekt:

enter image description here

hier ist mein html:

<div ng-show="!(loading)"> 
<div class="col-md-12"> 
     <div class="panel panel-default"> 
      <div class="panel-body" > 

       <canvas id="base"></canvas> 
      </div> 
     </div> 
    </div> 
</div> 

Meine Diagramme sind in den Optionen reaktionsfähig. Irgendwelche Vorschläge würden geschätzt werden!

Answer 1

Ich hatte das gleiche Problem einmal und das Problem tritt auf, weil das Element, in dem ich mein "Diagramm" gestoßen habe, nicht unter Last existierte. Überprüfen Sie, ob Ihr HTML-Code in Ordnung ist, bevor Sie Ihr Diagramm einfügen.

Übrigens, haben Sie mehr Code, um uns zu versorgen? es wird einfacher sein, Ihnen zu helfen

Answer 2

Sie müssen eine Funktion erstellen, die tatsächlich durchlaufen und Ihr Diagramm erstellen, nachdem das übergeordnete Element gerendert wurde. Sie können dies tun, indem Sie diese Funktion in ein Dokument-Ready-Tag einfügen. Wenn das Dokument fertig ist, wird die Funktion ausgelöst und das Diagramm erstellt, sobald die Größe der übergeordneten Elemente bekannt ist.

Etwas wie folgt aus:

function buildChart(){ 
//Build your chart here 
} 

Und dann wickeln Sie es wie folgt aus:

$(function(){ 
buildChart() 
}) 

Answer 3

Sie wissen nicht, was passiert ist, aber es funktioniert jetzt richtig ... Ich reinigte nur einige Dateien aus ältere Versionen. Hatte keine Zeit, irgendwelche Ihrer Lösungen zu versuchen, aber danke für die Antwort!