Vielleicht möchten Sie zuerst das [update] lesen, da sich die Art des Problems geändert hat.CSS-Datei nicht enthalten?
Ich versuche, eine AngularJs App Charting hinzuzufügen. Ich erhalte die folgenden Fehler
angular.js:13236 Error: Please set height and width for the chart element
at validateHeightAndWidth (https://rawgit.com/chinmaymk/angular-charts/bower/dist/angular-charts.js:138:15)
at link (https://rawgit.com/chinmaymk/angular-charts/bower/dist/angular-charts.js:106:7)
at http://localhost/plafotrm_2/js/angular/angular.js:9486:44
at invokeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:9492:9)
at nodeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:8978:11)
at compositeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:8226:13)
at compositeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:8229:13)
at compositeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:8229:13)
at compositeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:8229:13)
at compositeLinkFn (http://localhost/plafotrm_2/js/angular/angular.js:8229:13) <div id="chart1" ac-chart="chartType" ac-data="chartData" ac-config="chartConfig" class="ng-isolate-scope">
Doch mein index.html, ich <link rel="stylesheet" href="css/charts.css" /> und in css/charts.css, ich
.chartStyle
{
width: 500px;
height: 500px;
}
und das Diagramm soll in
<div
data-ac-chart="bar"
data-ac-data="chartData"
data-ac-config="chartConfig"
class="chartStyle" >
</div>
Es sieht alles gehen gut zu mir, und ich kopierte von einem Plunk.
Ich bin mir sicher, dass ich die richtige CSS-Datei einlese, denn wenn ich sie umbenenne, erhalte ich einen Fehler in der Entwicklerkonsole. Aber auch ohne Fehler in der CSS-Datei bekomme ich den oben gezeigten Fehler.
Irgendwelche Ideen, irgendjemand?
[Update] @SteveCampbell ‚s Kommentar und Antwort, gibt es nun keine Fehler in der Entwicklerkonsole Nach der Anwendung - leider gibt es auch keine Grafik auf der Seite :-(
Die HTML so sieht wie folgt aus
<div data-ac-chart="'bar'" data-ac-data="chartData" data-ac-config="chartConfig" class="chartStyle ng-isolate-scope"></div>
ohne Höhe oder Breite, dass waitForHeightAndWidth : true nur das Problem :-(
Maskieren ich denke, muss ich Lesen Sie die Dokumentation ...
Ich habe dies in der Steuerung ...
$scope.chartConfig = {
title: 'Products',
tooltips: true,
labels: false,
waitForHeightAndWidth : true,
mouseover: function() {},
mouseout: function() {},
click: function() {},
legend: {
display: true,
//could be 'left, right'
position: 'right'
}
};
$scope.chaartData = {
series: ['Sales', 'Income', 'Expense', 'Laptops', 'Keyboards'],
data: [{
x: "Laptops",
y: [100, 500, 0],
tooltip: "this is tooltip"
}, {
x: "Desktops",
y: [300, 100, 100]
}, {
x: "Mobiles",
y: [351]
}, {
x: "Tablets",
y: [54, 0, 879]
}]
};
Verdammt, du hast so viele Ausgaben :-) Wie kannst du dir Internet leisten? : D –
Die Plocker Demo funktioniert gut. Bitte fügen Sie einen Plunkter hinzu, der Ihren Fehler angibt oder fügen Sie Ihre Controller/Ansichten hinzu. – lin
Ja, ich weiß, dass das Demo gut funktioniert - deshalb wollte ich es in meine bestehende App integrieren ;-) Unerwarteterweise ist die App zu groß und zu plunk komplex (dazu muss sie mit meinem Server Ajax). Kannst du etwas falsch sehen mit dem was ich gepostet habe (er fragte, hoffentlich)? – Mawg