Uncaught Error: Graph container element not found

Fermé
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017 - 8 mars 2017 à 09:16
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017 - 9 mars 2017 à 08:21
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

jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
8 mars 2017 à 09:27
Bonjour

Il nous faudrait le code de ta page .
0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
8 mars 2017 à 11:35
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");
}
...
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650 > abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
8 mars 2017 à 11:40
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 ....
0
abirgl Messages postés 127 Date d'inscription lundi 31 octobre 2016 Statut Membre Dernière intervention 20 juin 2017
9 mars 2017 à 08:21
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();
}
}
0