Uncaught Error: Graph container element not found [Fermé]

Signaler
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017
-
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017
-
Bonjour,
Lorsque j'exécute ma page web, l'erreur suivante apparaît sur la console:
Uncaught Error: Graph container element not found morris.js:103
Comment je peux corriger ça svp ?
Merci d'avance


1 réponse

Messages postés
30127
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965
Bonjour

Il nous faudrait le code de ta page .
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

Voici le code :

function Grid(options) {
this.resizeHandler = __bind(this.resizeHandler, this);
var _this = this;
if (typeof options.element === 'string') {
this.el = $(document.getElementById(options.element));
} else {
this.el = $(options.element);
}
if ((this.el == null) || this.el.length === 0) {
throw new Error("Graph container element not found");
}
...
Messages postés
30127
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2020
2 965 >
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

le code de la PAGE ... pas juste un bout de fonction.
Car cette fonction est appellée par qqchose .... cette chose faisant reférence (via le this) à un truc qui n'existe pas ou est null ....
Messages postés
127
Date d'inscription
lundi 31 octobre 2016
Statut
Membre
Dernière intervention
20 juin 2017

Bonjour,
Voici le code de ma page web :


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LTH</title>
<link href="assets/plugins/bootstrap/bootstrap.css" rel="stylesheet" />
<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
<link href="assets/plugins/pace/pace-theme-big-counter.css" rel="stylesheet" />
<link href="assets/css/style.css" rel="stylesheet" />
<link href="assets/css/main-style.css" rel="stylesheet" />
<link href="assets/plugins/morris/morris-0.4.3.min.css" rel="stylesheet" />
<script src=""quot;https://maps.googleapis.com/maps/api/js?key=AIzaSyDm85_icmgwRYEITWUiNSghvz30CZnB6NQ&language=fr" type="text/javascript"></script>
<script type="text/javascript">
function TabOTJournaliere()
{
if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(maPosition);
}
function maPosition(position)
{
var latOrigin = position.coords.latitude ;
var lngOrigin=position.coords.longitude;
var Code_Equipe=4;
var xhr = new XMLHttpRequest();
xhr.open("GET", "ListeOTJournaliere.php?Code_Equipe="+Code_Equipe+"&latOrigin="+latOrigin+"&lngOrigin="+lngOrigin,true);
xhr.send(null);
xhr.onreadystatechange = result;
function result()
{
if((xhr.status == 200)&&(xhr.readyState==4))
document.getElementById("tabtj").innerHTML=xhr.responseText;
}
}
}
</script>
</head>
<body onload="TabOTJournaliere()">
<form name="faccueil" method="POST">
<div id="wrapper">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation" id="navbar">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<ul class="nav navbar-top-links navbar-right">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" rel="nofollow noopener noreferrer" target="_blank">
<img src=""quot;assets/img/logo-LTH-new.jpg" alt="" />
</a>
</li>
</ul>
</div>
<ul class="nav navbar-top-links navbar-right">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" rel="nofollow noopener noreferrer" target="_blank">
<img src=""quot;assets/img/cst.png" alt="" />
</a>
</li>
</ul>
</nav>
<nav class="navbar-default navbar-static-side" role="navigation">
<div class="sidebar-collapse">
<ul class="nav" id="side-menu">
<li>
<div class="user-section">
<div class="user-section-inner"><img src=""quot;assets/img/user.jpg" alt=""></div>
<div class="user-info">
<div> <strong>
ABIR </strong></div>
<div class="user-text-online"><span class="user-circle-online btn btn-success btn-circle "></span> Online</div>
</div>
</div>
</li>
<li><a href="#" rel="nofollow noopener noreferrer" target="_blank"><i class="fa fa-dashboard fa-fw"></i>Liste Des OT Planifiés</a> </li>
<li><a href="InterventionsEnCours.php?id=4" rel="nofollow noopener noreferrer" target="_blank"><i class="fa fa-wrench fa-fw"></i>Interventions En Cours</a> </li>
<li> <a href="InterventionsValidees.php?id=4" rel="nofollow noopener noreferrer" target="_blank"><i class="fa fa-table fa-fw"></i>Interventions Validées</a> </li>
<li><a href="Logout.php" rel="nofollow noopener noreferrer" target="_blank"><i class="fa fa-sign-out fa-fw"></i>Logout</a> </li>
</ul>
</div>
</nav>
<div id="page-wrapper">
<div class="row">
<div class="col-lg-12">
<br/>
<br/>
<br/>
<!--<h1 class="page-header"></h1> -->
</div>
</div>
<div class="row"></div>
<div class="row">
<div class="col-lg-8">
<div class="panel panel-primary">
<div class="panel-heading">
<i class="fa fa-bar-chart-o fa-fw"></i>Liste des OT Planifiés : 2017-03-9 <div class="pull-right"> <div class="btn-group"> <ul class="dropdown-menu pull-right" role="menu"> </ul> </div> </div>
</div>
<div class="panel-body">
<div class="row">
<div class="col-lg-12">
<div class="table-responsive" id="tabtj"> </div>
<div name="LinkGPS"> </div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="panel panel-primary text-center no-boder"></div>
<div class="panel panel-primary text-center no-boder"></div>
<div class="panel panel-primary text-center no-boder"></div>
<div class="panel panel-primary text-center no-boder"></div>
</div>
</div>
<div class="row"> <div class="col-lg-4"></div></div> </div> </div>
</div>
<script src=""quot;assets/plugins/jquery-1.10.2.js"></script>
<script src=""quot;assets/plugins/bootstrap/bootstrap.min.js"></script>
<script src=""quot;assets/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src=""quot;assets/plugins/pace/pace.js"></script>
<script src=""quot;assets/scripts/siminta.js"></script>
<script src=""quot;assets/plugins/morris/raphael-2.1.0.min.js"></script>
<script src=""quot;assets/scripts/dashboard-demo.js"></script>
<script src=""quot;assets/plugins/morris/morris.js"></script>
</head>
</form>
</body>
</html>

Le code de la fonction qui génère l'exception :

function Grid(options) {
this.resizeHandler = __bind(this.resizeHandler, this);
var _this = this;
if (typeof options.element === 'string') {
this.el = $(document.getElementById(options.element));
} else {
this.el = $(options.element);
}
if ((this.el == null) || this.el.length === 0) {
throw new Error("Graph container element not found");
}
if (this.el.css('position') === 'static') {
this.el.css('position', 'relative');
}
this.options = $.extend({}, this.gridDefaults, this.defaults || {}, options);
if (typeof this.options.units === 'string') {
this.options.postUnits = options.units;
}
this.raphael = new Raphael(this.el[0]);
this.elementWidth = null;
this.elementHeight = null;
this.dirty = false;
this.selectFrom = null;
if (this.init) {
this.init();
}
this.setData(this.options.data);
this.el.bind('mousemove', function(evt) {
var left, offset, right, width, x;
offset = _this.el.offset();
x = evt.pageX - offset.left;
if (_this.selectFrom) {
left = _this.data[_this.hitTest(Math.min(x, _this.selectFrom))]._x;
right = _this.data[_this.hitTest(Math.max(x, _this.selectFrom))]._x;
width = right - left;
return _this.selectionRect.attr({
x: left,
width: width
});
} else {
return _this.fire('hovermove', x, evt.pageY - offset.top);
}
});
this.el.bind('mouseleave', function(evt) {
if (_this.selectFrom) {
_this.selectionRect.hide();
_this.selectFrom = null;
}
return _this.fire('hoverout');
});
this.el.bind('touchstart touchmove touchend', function(evt) {
var offset, touch;
touch = evt.originalEvent.touches[0] || evt.originalEvent.changedTouches[0];
offset = _this.el.offset();
_this.fire('hover', touch.pageX - offset.left, touch.pageY - offset.top);
return touch;
});
this.el.bind('click', function(evt) {
var offset;
offset = _this.el.offset();
return _this.fire('gridclick', evt.pageX - offset.left, evt.pageY - offset.top);
});
if (this.options.rangeSelect) {
this.selectionRect = this.raphael.rect(0, 0, 0, this.el.innerHeight()).attr({
fill: this.options.rangeSelectColor,
stroke: false
}).toBack().hide();
this.el.bind('mousedown', function(evt) {
var offset;
offset = _this.el.offset();
return _this.startRange(evt.pageX - offset.left);
});
this.el.bind('mouseup', function(evt) {
var offset;
offset = _this.el.offset();
_this.endRange(evt.pageX - offset.left);
return _this.fire('hovermove', evt.pageX - offset.left, evt.pageY - offset.top);
});
}
if (this.options.resize) {
$(window).bind('resize', function(evt) {
if (_this.timeoutId != null) {
window.clearTimeout(_this.timeoutId);
}
return _this.timeoutId = window.setTimeout(_this.resizeHandler, 100);
});
}
if (this.postInit) {
this.postInit();
}
}