GDrawing.newDrawing( id, parentId );
id: the id of a drawing. A new <embed> element with this id will be created.
parentId: the id of the element on which the above <embed> element will be appended.
Example:
<p id="insertPoint_drawing1"/> <input id="btn1_drawing1" type="button" value="New Drawing" onclick="GDrawing.newDrawing( 'drawing1', 'insertPoint_drawing1' );" />
Click this button to insert an svg graph here.
GDrawing.newDrawing( id );
id: the id of a drawing. If a non-exist drawing id is provided, an error message will pop up.
Example:
<input id="btn2_drawing1" type="button" value="Edit Drawing" onclick="GDrawing.editDrawing( 'drawing1' );" />
Click this button to edit the above svg graph.
GDrawing.removeDrawing( id );
id: the id of a drawing. If a non-exist drawing id is provided, an error message will pop up. The <embed> element will be removed from the DOM tree.
Example:
<input id="btn3_drawing1" type="button" value="Remove Drawing" onclick="GDrawing.removeDrawing( 'drawing1' );" />
Click this button to remove the above svg graph.
GDrawing.displayDrawing( id, parentId, str, width, height );
id: the id of a drawing. A new <embed> element with this id will be created.
parentId: the id of the element on which the above <embed> element will be appended.
str: the data string to describe the drawing
width: the width of the drawing
height: the height of the drawing
Example:
<p id="insertPoint_drawing2"> <input id="btn1_drawing2" type="button" value="Display Drawing" onclick="GDrawing.displayDrawing( 'drawing2', 'insertPoint_drawing2', '2|Point|FreePoint||C|108|107|1|1|0|&', 301, 301 );" />
Click this button to display a svg graph here.
GDrawing.replaceDrawing( id, str, width, height );
id: the id of a drawing. If a non-exist drawing id is provided, an error message will pop up.
str: the data string to describe the drawing.
width: the width of the drawing
height: the height of the drawing
Example:
<br />data: <textarea id="k1" rows="10" cols="60"> </textarea>
<br />width: <input id="k2"> </input>
height: <input id="k3"> </input>
<input id="btn2_drawing2" type="button" value="Replace Drawing"
onclick="GDrawing.replaceDrawing( 'drawing2',
document.getElementById('k1').value,
document.getElementById('k2').value,
document.getElementById('k3').value );" />
data:
width:
height:
Click the above button to replace the drawing in the "Display a Drawing" session.
GDrawing.getDataStr( id );
GDrawing.getWidth( id );
GDrawing.getHeight( id );
id: the id of a drawing. If a non-exist drawing id is provided, an error message will pop up.
Example:
<input id="btn4_drawing1" type="button" value="Get Data and Dimension"
onclick="document.getElementById( 'k1' ).value = GDrawing.getDataStr( 'drawing1' );
document.getElementById( 'k2' ).value = GDrawing.getWidth( 'drawing1' );
document.getElementById( 'k3' ).value = GDrawing.getHeight( 'drawing1' );" />
Click this button to get data and dimension of the drawing1.
Results will be shown last session "Replace a Drawing". After you get the information, you may save it to the server.
GDrawing.registerCallback( handler );
handler: the call back function which will be called by the GDrawing module after each operations.
Example:
<input type="checkbox" id="cbx"
onclick="if ( document.getElementById('cbx').checked )
GDrawing.registerCallback( foo );
else
GDrawing.registerCallback( null );" />
Enable call back
<script>
function foo( id, operation )
{
alert( operation + " applied to drawing with id " + id );
}
</script>
Enable call back
Once you enable the call back, the function foo will be called after each operation described in session 1 to 5. You can retry the tests in session 1 to 5. You can define your own call back function.