Fabric.js rectangle is not showing up - fabricjs

Question

Why the rectangle is not showing up? I've found the examples at GitHub, official site etc. But they're not working for me.
<script type="text/javascript">
var fCanvas;
window.onload = function (){
var oldCanvas = document.getElementById('canvas');
fCanvas = new fabric.Canvas('canvas',
{
width: oldCanvas.parentNode.clientWidth,
height: oldCanvas.parentNode.clientHeight
});
}
function CreateGraphicObject(id){
//...
var rect = new fabric.Rect({
left: 100,
top: 100,
fill: 'red',
width: 20,
height: 20
});
fCanvas.add(rect);
//fCanvas.renderAll(); - did not help
}
</script>
Thanks.

Answer 1

I had created a fiddle. I hope it will help you.
https://jsfiddle.net/mullainathan/hgnvaqej/

Answer 2

You have created function but never called it, so the rectangle never gets created.
You just need to call the function, in your code I suppose the best place to call it after creating the canvas:
window.onload = function (){
var oldCanvas = document.getElementById('canvas');
fCanvas = new fabric.Canvas('canvas',
{
width: oldCanvas.parentNode.clientWidth,
height: oldCanvas.parentNode.clientHeight
});
CreateGraphicObject(); //I didn't pass any "id" because it makes no sense in the given code
}
function CreateGraphicObject(){
var rect = new fabric.Rect({
left: 100,
top: 100,
fill: 'red',
width: 20,
height: 20
});
fCanvas.add(rect);
fCanvas.renderAll();
}