Hello

I need to implement graphical annotations, such as Sticky Notes, Text, Pen, Line, Arrow, Stamp, and Highlighter. So I have a panel with an ImageComponent inside. I implemented Sticky Notes, Text, and Stamp utilizing Ext.draw.Component class. I'm stuck with Pen, Arrow, and Line. Please let me know if you have any ideas how to implement these stuff.

This is an example of Stamp annotation:

Code:
new Ext.draw.Component( {
			floating : true,
			renderTo: 'mainPanel',
			id: 'win' + counter,	
			style : {
				backgroundColor : 'transparent',
				opacity : '.5',
				width : '200px',
				height : '80px',
				fontSize : '24',
				textAlign : 'center',
				verticalAlign : 'bottom',
				color : 'red',
				border : '1px solid red'
			},
			frame : false,
			html : txt+'<br>03/31/2011',
			draggable : true,
			resizable : true,
			x : 200,
			y : 500
		}).show();

		Ext.get('win' + counter).addListener('contextmenu' , function(evtObj, element) { 
			evtObj.stopEvent(); 
			var x =  evtObj.getPageX(); 
			var y =  evtObj.getPageY(); 
			showCxtMenu(element, x, y);
		});