2013-07-16 4 views
0

저는 Javascrip/Jquery/Jqplot을 처음 접했고 혼자서 배우려고합니다. 그런 다음 몇 가지 질문이 있습니다. 이 코드로 간단한 그래프를 표시 할 수 있습니까? 작동하지 않기 때문에 빈 페이지가 표시됩니다.JqPlot - 간단한 그래프가 표시되지 않습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>Test</title> 
<link rel="stylesheet" type="text/css" href="css/jquery.jqplot.css" /> 

<script language="javascript" type="text/javascript" src="js/jqplot.canvasTextRenderer.min.js"></script> 
<script language="javascript" type="text/javascript" src="js/jqplot.canvasAxisLabelRenderer.min.js"></script> 
<script language="javascript" type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<script language="javascript" type="text/javascript" src="js/jquery.jqplot.js"></script> 
<script language="javascript" type="text/javascript" src="js/jqplot.dateAxisRenderer.js"></script> 
<script language="javascript" type="text/javascript" src="js/jqplot.categoryAxisRenderer.js"></script> 
<script language="javascript" type="text/javascript" src="js/jqplot.ohlcRenderer.js"></script> 
<script language="javascript" type="text/javascript" src="js/jqplot.highlighter.js"></script> 
<script language="javascript" type="text/javascript" src="js/jqplot.cursor.js"></script> 
<script language="javascript" type="text/javascript" src="js/customCandlestick.js"></script> 

<script type="text/javascript"> 
$(document).ready(function(){ 
     document.write("<p>It works!!!</p>"); 
     var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]); 
    }); 
</script> 

</head> 
<body> 
<div id="chart1"></div> 
</body> 
</html> 

답변

0

내가 프로젝트, 너무이 라이브러리를 사용하는 자사의 정말 좋은! .., 당신은 단지 문서를 변경해야 난 그냥 당신이 그것을 게시 예제를 확인하고 난 당신에게 오류를 일으키는 것을 발견 .write 문장을 사용하면, 예를 들어 console.log 함수를 사용하면 작동 할 것입니다.

ex. 중요한

$(document).ready(function(){ 
     console.log("It works!!!"); 
     var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]); 
    }); 

또 다른 것은 당신이 JQuery와 전혀 정의 오류를 방지하기 위해 JQuery와 참조 후 jqplot의 모든 JS 파일을 참조 할 필요가 있으므로이 라이브러리는 jQuery를 사용한다는 것입니다.

도움이 되었기를 바랍니다.

0

당신은 '

document.write('<p>It works!!!</p>'); 

을 제거 또는 여기 (당신이 했나요 무슨에 의해

document.write('<p>It works!!!</p><div id="chart1"></div>'); 

귀하의 document.write를 문은 HTML 페이지의 본문 부분을 대체하여 교체해야 <> 작동합니다! </p>).

이렇게하면 HTML 페이지에 "chart1"ID가있는 div가 더 이상 포함되지 않습니다. jqplot에 "chart1"로 식별 된 div에 그래픽을 표시하도록 지정 했으므로 (document.write 문이 지워 버렸습니다) 그래픽을 볼 수없는 정상적인 동작입니다.

PS : 그래프를 그리기 위해 jqplot 플러그인을 모두 포함하지 않아도됩니다. 더 복잡해지지 않으면 "css/jquery.jqplot.css"및 "js/jquery.jqplot.js"만 포함하는 것이 좋습니다. 더 복잡한 그래프의 경우 필요한 플러그인 만 포함하십시오 (예 : 날짜 축을 사용해야하는 경우 "js/jqplot.dateAxisRenderer.js").

편집

jsFiddle here 작업을 참조하십시오, 두 개의 "document.write를"라인을 재생하려고 (코멘트하고 주석을 제거하려고).

관련 문제