Highcharts: Uncaught TypeError: $(...).highcharts est pas une fonction
obtenir cette erreur en exécutant un HighCharts dans mon Application JSP.
Uncaught TypeError: $(...).highcharts is not a function(anonymous function) @ VendorReports:125n.Callbacks.j @ jquery-1.11.0.js:893n.Callbacks.k.fireWith @ jquery-1.11.0.js:928n.extend.ready @ jquery-1.11.0.js:982K @ jquery-1.11.0.js:989
s'il vous Plaît suggérer quoi faire
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
$(function () {
$('#container').highcharts({
colors: ["#7cb5ec", "#f7a35c"],
chart: {
type: 'column'
},
title: {
text: 'Total fruit consumtion, grouped by gender'
},
xAxis: {
categories: ['Apples' ]
},
yAxis: {
allowDecimals: false,
min: 0,
title: {
text: 'Number of fruits'
}
//Nothing wrong with this code
5 réponses
j'avais ce problème, aussi. Assurez - vous que jQuery est importé avant highchart.js. Qui a résolu le problème pour moi.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
Qu'advient-il si vous remplacez
$('#container').highcharts({
colors: ["#7cb5ec", "#f7a35c"],
chart: {
type: 'column'
},
/* ... */
par
var chart = new Highcharts.Chart({
colors: ["#7cb5ec", "#f7a35c"],
chart: {
type: 'column',
renderTo: 'container'
},
/* ... */
?
j'ai eu le même problème que vous il y a un moment et je l'ai résolu en utilisant ce type d'initialisation.
j'utilisais une ancienne version de la version High charts. De leur site web, j'ai supposé que la version énumérée sous la version spécifique était leur dernière version et utilisé que de sorte qu'il ne serait pas auto mise à jour sur moi. Cependant, la version qu'ils avaient listé était super ancienne donc le changement à la dernière version actuelle corrigé le problème.
l'approche adoptée à partir des exemples officiels fonctionne bien. Ils ont défini l'étiquette de script include dans l'étiquette de corps donc la solution donnée par Kabulan0lak est mieux je pense.
<html>
<head>
<title>Highcharts Example</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('#container').highcharts({
chart: {
type: 'spline'
}
// ... other options and data/series
});
});
</script>
</head>
<body>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</body>
</html>
cela arrive avec moi aussi. Dans mon cas, je dois cliquer sur un bouton pour charger la carte et si je clique deux fois ou plus la carte s'arrête de fonctionner. J'ai été réglage de la couleur comme ceci:
Highcharts.setOptions({
colors: Highcharts.map(Highcharts.getOptions().colors, function (color) {
return {
radialGradient: {
cx: 0.5,
cy: 0.3,
r: 0.7
},
stops: [
[0, color],
[1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
]
};
})
});
$.getJSON("./myDataGraph.php", function(response){
// Create the chart
var chart = Highcharts.chart('myGraph', {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'pie'
},
... });
Je n'ai pas pu résoudre l'erreur, mais j'ai supprimé les "Highcharts.setOptions" et le graphique fonctionne!!!