Cohabitation jQuery et HighChart, IE aux abonnés absents
Bonjour,
Contexte :
Je travail actuellement au développement d'un module destiné a l'affichage de donnée numériques (mesures médicales). Pour assurer l'affichage, j'utilise le plugin HighStock.
HighStock produit un code SVG (VML pour IE 6 à 8).
Pour une meilleur ergonomie je voudrais mettre en place un Slide ou un carrousel qui permettrait de naviguer aisément entre plusieurs type de graphique (pression sanguine, rythme cardiaque, taux de glucose par exemple)
J'ai essayer plusieurs modules, mais aucun ne fonctionnais avec IE version 6 à 8. J'ai donc entrepris de développer quelque chose de plus simple dans un 1er temps.
Problème :
Contrairement a Firefox ou chromium, sous IE mon code ne marche pas.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
| $.ajax({
url: glob_param['url']+'php/querysoap.php'
, data: {what: 'list_measure'}
, dataType: 'xml'
, async: true
, success: function (answer, status, xhr) {
var rootName // [Simplification pour le forum] Contien le nom du noeud racine de mon XML
var childName // [Simplification pour le forum] Contien le nom du noeud de 1er niveau de mon XML
$(answer).find(childName).each(function(){
loadDisplaysFromXML(
'php/querysoap.php'
, {
what: 'xml_list'
, measure: $(this).text()
}
, glob_param['show_div']
, false
); // Cette fonction se charge d'appeler highchart et d'afficher les graphiques
});
}
, complete: function () {
alert('complete build');
/*
Ici le code d'affichage du slide, j'ai absolument besoin que les graph soit chargé et affiché
*/
}
}); |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
| //*
function loadDisplaysFromXML (_adresse, _param, _block, _width_px) {
var svg;
$.ajax({
url: glob_param['url'] + _adresse
, data: _param
, dataType: 'xml'
, async: false
, success: function(answer, status, xhr){
// declaration des variables locales
var rootName // [Simplification pour le forum] Contien le nom du noeud racine de mon XML
var childName // [Simplification pour le forum] Contien le nom du noeud de 1er niveau de mon XML
var i; // Variables d'increment
var data = [], subArray = []; // Stockage de données complet
var names = []; // Stockage de nom de mesure
var garphUnaryData = [], graphTotalData = []; // Données preparer pour l'affichage
// [...] Formalisation des données pour highstock [...]
// On crée un div pour chaque graphique
blk = _block.substring(1, _block.length) + glob_count;
glob_count++;
$(_block).append('<div id="'+blk+'" class="graph" style="width: 500px;"></div>');
((glob_svg === undefined) ? glob_svg = [blk] : glob_svg.push(blk));
//blk = _block.substring(1, _block.length);
drawChart( // Et on envoi a highchart pour la génération visuel.
graphTotalData // Set de données
, blk // Bloque ou l'on affiche le graphe
, _width_px); // Largeur du graphe
} // End Of UnNamed Function
}); // End Of Ajax Block
return svg;
}//*/ |
Dans le cas d'IE alert('complete build'); se fait bien avant l'affichage des graphiques et du coup la manipulation DOM effectuée par le slide échoue lamentablement.
Étant néophyte dans la pratique du javascript et de jQuery, je ne sais dire si l'erreur viens de mon utilisation des librairie ou si il y a des comportement plus fin qui mérite une attention toute particulière.
Pour ceux qui voudrais une version complète du script :
web_service.js
index.php
Merci d'avance pour votre temps et votre aide
