知道爲什麼矩形不會進入我的Fabricjs畫布？

http://jsfiddle.net/a7ZSG/10/ 有鏈接到jsfiddle。知道爲什麼矩形不會進入我的Fabricjs畫布？

在綠色的畫布上應該有一個紅色的矩形，但由於某種原因它不會出現，任何人都知道爲什麼？我試過把一個window.onload放在與畫布相關的所有東西上，但我不工作。

HTML：

<!doctype html> 
<html lang="en" ;> 

    <head> 
     <meta charset="utf-8" /> 
     <title>CustomCase</title> 
     <link rel="stylesheet" href="HeaderFooter.css"> 
     <link rel="stylesheet" href="SkapaDesign.css"> 
     <script src="Jquery.js"></script> 
     <script src="Fabric.js"></script> 
     <script src="Canvas.js"></script> 
    </head> 

    <body> 
     <div id="Wrapper"> 

      <section id="Body"> 
       <img id="UpperShadow" src=NeråtSkugga.png> 
       <div id="LeftColumn"> 
        <div id="TextMode"></div> 
        <div id="CanvasContainer"> 
         <canvas id="Canvas"></canvas> 
        </div> 
        <div id="LayerMode"></div> 
        <div id="IPhoneMode"></div> 
       </div> 
       <div id="RightColumn"> 
        <div id="TextureMode"></div> 
        <div id="TextureFilter"></div> 
        <div id="TextureView"> 
         <div id="TextureViewInside"> 
          <div id="images"> 
           <img src="FärgadePapper.png"> 
           <img src="Hajar.png"> 
           <img src="Labyrint.png"> 
           <img src="Martini.png"> 
           <img src="FärgadePapper.png"> 
           <img src="Hajar.png"> 
           <img src="Labyrint.png"> 
           <img src="Martini.png"> 
           <img src="FärgadePapper.png"> 
           <img src="Hajar.png"> 
           <img src="Labyrint.png"> 
           <img src="Martini.png"> 
           <img src="FärgadePapper.png"> 
          </div> 
         </div> 
        </div> 
       </div> 
       <img id="LowerShadow" src=UppåtSkugga.png> 
      </section> 
     </div> 
    </body> 

</html>

CSS：

#Body { 
    height: 675px; 
} 
/*--------------------------------Body--------------------------------*/ 
#TextMode, #TextureMode, #CanvasContainer, #Canvas, #LayerMode, #TextureFilter, #TextureView, #IPhoneMode { 
    float: left; 
} 
/*------------------------------Columns------------------------------*/ 
#LeftColumn { 
    float: left; 
    width: 355px; 
    margin: 20px 30px 0px 0px; 
} 
#RightColumn { 
    float: left; 
    width: 600px; 
    margin-top: 20px; 
} 
/*----------------------------Left Column----------------------------*/ 
#TextMode { 
    width: 340px; 
    height: 40px; 
    margin-left: 15px; 
    background: #848484; 
} 
#CanvasContainer { 
    width: 270px; 
    height: 519px; 
    margin-left: 15px; 
    background: black; 
} 
#Canvas { 
    overflow: hidden; 
    background: green; 
    width: 270px; 
    height: 519px; 
} 
#LayerMode { 
    width: 70px; 
    height: 519px; 
    background: #848484; 
} 
#IPhoneMode { 
    width: 340px; 
    height: 40px; 
    margin-left: 15px; 
    background: #848484; 
} 
/*----------------------------Right Column---------------------------*/ 
#TextureMode { 
    width: 600px; 
    height: 40px; 
    background: #848484; 
} 
#TextureFilter { 
    width: 130px; 
    height: 559px; 
    background: #848484; 
} 
#TextureView { 
    width: 470px; 
    height: 559px; 
    overflow: auto; 
} 
#TextureViewInside { 
    padding: 10px; 
} 
#images img { 
    width: 97px; 
    display: inline-block; 
    vertical-align: top; 
    padding: 4px; 
}

的Javascript：

$(document).ready(function() { 
    $("#images img").click(function() { 
     var getsource = $(this).attr("src"); 
     alert(getsource); 
    }); 
}); 

var canvas = new fabric.Canvas('Canvas'); 
var rect = new fabric.Rect({ 
    fill: 'red', 
    width: 20, 
    height: 20, 
    angle: 45 
}); 
canvas.add(rect);

來源

2013-11-14 user2961869

我得到一個紅色三角形/角落，當我跑嗎......？ –