1
J'essaie de créer un gadget de barre latérale Windows avec JQuery et flot.JQuery et flot dans un gadget de barre latérale Windows
Lorsque je lance le gadget dans FF, le graphique est tracée correctement. Mais quand je le lance depuis le gadget, ça ne marche pas. Je sais que le code JQuery fonctionne car je peux l'utiliser pour changer le html, le style, etc.
Donc le problème est dans la partie flot.
Des idées? pensées?
Fondamentalement, j'essaye de créer un gadget de barre latérale avec un graphique, vous avez une meilleure solution je serai heureux de les entendre.
Le code HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.flot.js"></script>
<script language="javascript" type="text/javascript" src="js/Docked.js" ></script>
<link href="css/Docked.css" rel="stylesheet" type="text/css" />
</head>
<body onload="CheckDockState();">
<g:background id="imgBackground">
<div id="gadgetContent">
</div>
</g:background>
</body>
</html>
Le code JavaScript:
// Gadget width and height.
var gadgetWidth = 800;
var gadgetHeight = 800;
// Amount to scale gadget when docked or undocked.
var scaleDocked = 1;
var scaleUndocked = 2;
// Amount of time desired to perform transition (in seconds).
var timeTransition = 2;
// Declare the dock and undock event handlers.
try
{
System.Gadget.onDock = CheckDockState;
System.Gadget.onUndock = CheckDockState;
}
catch(err){}
// --------------------------------------------------------------------
// Check the gadget dock state; set the gadget style.
// --------------------------------------------------------------------
function CheckDockState()
{
try
{
var oBackground = document.getElementById("imgBackground");
System.Gadget.beginTransition();
var oBody = document.body.style;
if (System.Gadget.docked)
{
oBody.width = gadgetWidth*scaleDocked;
oBody.height = gadgetHeight*scaleDocked;
oBackground.src = "../images/bg_docked.png";
//txtDocked.innerText = 'Docked';
gadgetContent.innerHTML = 'Docked <button onclick="ShowChart();">press me</button>';
gadgetContent.className = 'gadgetDocked';
}
else
{
oBody.width = gadgetWidth*scaleUndocked;
oBody.height = gadgetHeight*scaleUndocked;
oBackground.src = "../images/bg_undocked.png";
//txtDocked.innerText = 'Undocked';
gadgetContent.innerHTML = 'Docked <button onclick="ShowChart();">press me</button>';
gadgetContent.className = 'gadgetUndocked';
}
System.Gadget.endTransition(System.Gadget.TransitionType.morph, timeTransition);
}
catch(err)
{
// in a browser, some variables are different/missing then in the gadget, so i'm using this
gadgetContent.innerHTML = 'Docked <button onclick="ShowChart();">press me</button>';
}
}
function ShowChart()
{
var d1 = [];
for (var i = 0; i < 14; i += 0.5)
d1.push([i, Math.sin(i)]);
var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];
// a null signifies separate line segments
var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];
// just to see the jquery works
$("#gadgetContent").width(200);
$("#gadgetContent").height(200);
jQuery.plot($("#gadgetContent"), [ d1, d2, d3 ]);
}
@Andy, j'ai essayé les deux suggestions, je ne l'ai pas résolu – Amirshk
@Am: Des messages d'erreur? Depuis qu'il fonctionne dans Firefox, avez-vous essayé dans IE? –
Oui, essayé IE, fonctionne également. Je suppose que c'est quelque chose avec la façon dont Flot se dessine. ne peut pas comprendre quoi, parce que les widgets sont vraiment difficiles à déboguer – Amirshk