Example: Basic Graphics Implementation

HTML

<div id="mygraphiccontainer"></div>

CSS

#mygraphiccontainer {
    position: relative;
    width: 700px;
    height:400px;
}

Javascript

Create a Graphic instance

var mygraphic = new Y.Graphic({render:"#mygraphiccontainer"});

Use the addShape method to create an ellipse.

var myellipse = mygraphic.addShape({
    type: "ellipse",
    fill: {
        color: "#9aa"
    },
    stroke: {
        weight: 2,
        color: "#000"
    }
});

Complete Example Source

<div id="mygraphiccontainer"></div>
<script>
    YUI().use('graphics', function (Y) 
    { 
        //create a graphic instance
        var mygraphic = new Y.Graphic({autoSize:true, render:"#mygraphiccontainer"});
        
        //create an ellipse with addShape
        var myellipse = mygraphic.addShape({
            type: "ellipse",
            fill: {
                color: "#9aa"
            },
            stroke: {
                weight: 2,
                color: "#000"
            },
            width: 150,
            height: 100,
            x: 35,
            y: 35
        });
    });
</script>