2011-10-09 95 views
-2

我想繪製一張在我的VC++程序中很漂亮的圖表,因此決定用HTML和JavaScript實現。JavaScript不按預期方式工作

就像它顯示的那樣,我下載了一個Javascript庫並在它的網站中使用它。
如何使用它?

下載,包括raphael.js到你的HTML頁面,然後用它簡單:

// Creates canvas 320 × 200 at 10, 50 
var paper = Raphael(10, 50, 320, 200); 

// Creates circle at x = 50, y = 40, with radius 10 
var circle = paper.circle(50, 40, 10); 

// Sets the fill attribute of the circle to red (#f00) 
circle.attr("fill", "#f00"); 

// Sets the stroke attribute of the circle to white  
circle.attr("stroke", "#fff"); 

我包含的JavaScript文件象下面這樣:

<head> 
<script type="text/javascript" src="raphael.js"></script> 
<script type="text/javascript"> 
ABOVE CODE 
</script> 

如果你試試吧,它不會工作。我試圖讓它工作,但不能。我有個問題。我怎樣才能做到這一點,而不需要將其中的內容複製到演示頁面?當然,它包括文檔,但它是參考。

它是如何工作的?謝謝!

+3

「它不工作」是實際上可以最廣泛,因此最壞的錯誤描述我可以想像的。 –

回答

1
  • Raphael鏈接正確嗎? (查看源代碼,然後按raphael.js鏈接 - 它是否工作?)
  • 嘗試使用reference中的示例。你的代碼應該在整個屏幕上繪製。
  • 您是否看到在頁面中創建的新元素?爲此使用螢火蟲。
  • 您正在使用哪種版本的Raphael?最近,它已升級到第2版。
3

檢查參考拉斐爾庫,然後試試這個代碼:

<head> 
    <script type='text/javascript' src='raphael.js'></script> 

    <script type='text/javascript'> 
    //<![CDATA[ 
    window.onload=function(){ 
    // Creates canvas 320 × 200 at 10, 50 
    var paper = Raphael(10, 50, 320, 200); 

    // Creates circle at x = 50, y = 40, with radius 10 
    var circle = paper.circle(50, 40, 10); 
    // Sets the fill attribute of the circle to red (#f00) 
    circle.attr("fill", "#f00"); 

    // Sets the stroke attribute of the circle to white  
    circle.attr("stroke", "#fff"); 
    } 
    //]]> 
    </script> 
</head> 

這對我的作品時,請確保您的參考是好的。

JSFiddle