DIR : /home/kozerus/public_html/cropex/js/wz/wz_draw1_bugs.html

/home/kozerus/public_html/cropex/js/wz

<html>
<head>
	<title>/js/wz/wz_draw1.html</title>

	</head>

<body bgcolor=linen>
	<h1>/js/wz/wz_draw1.html 20230213_2100</h1>
	<script type="text/javascript" src="/js/wz/wz_graphics.js"></script>
	<script type="text/javascript" src="/js/wz/wz_dragdrop.js"></script>


	<script type="text/javascript">
  <!-- // <![CDATA[
	var graph1;
	function draw() {
		graph1 = new jsGraphics("canvas1");
// slower drawing, but printable! But width is screwed up in non-print (screen) IE view...
// graph1.setPrintable(true);
		graph1.setColor("orange");
		graph1.fillRect(20, 200, 400, 200);

//TODO: break into separate methods to break apart the drawing
//graph1.paint();
//setTimeout("", 2000);
		graph1.setColor("linen");
		graph1.setStroke(3);
		var xPoints = new Array(20,  80,  160, 230, 270, 300, 335, 380, 417); //end-x and start-y adjusted for stroke width!
		var yPoints = new Array(397, 365, 380, 320, 330, 300, 265, 285, 200);
		graph1.drawPolyline(xPoints, yPoints);
		graph1.setColor("#0000FF");
		graph1.setStroke(1);
		graph1.drawEllipse(60, 235, 50, 50);
		graph1.setColor("red");
		var xPts = new Array(140, 180, 220, 180);
		var yPts = new Array(235, 210, 235, 260);
		graph1.drawPolygon(xPts, yPts);
		graph1.setColor("black");
		text="jkwii is me";
		graph1.drawString(text, 40, 300);
		graph1.paint();
		}

	function erase() {
		if (graph1) { graph1.clear(); }
		}

	// ]]> -->
	</script>


	<style type="text/css">
		body {
			font-family: Arial, Helvetica, Verdana, sans-serif;
/*text-transform: uppercase;
			position: relative;
			left: 20%;
			width: 80%;*/
			}
		</style>

	</head>

<body bgcolor=linen>
	<!--onload="draw();"-->
	<noscript><h3 class="no-js">This links from this page require that JavaScript be enabled.</h3></noscript>
<!--NOTE: This script MUST be AFTER the opening of the body tag.-->
<script type="text/javascript" src="/js/wz/wz_dragdrop.js"></script>
<!--
<h1>Walter Zorn's JavaScript Libraries</h1>
<p>See <a href="http://www.walterzorn.com/">Walter Zorn's site at http://www.walterzorn.com/</a> for more examples and details.</p>
<h3>JavaScript Vector Graphics</h3>
<div>
  <p>Let's draw something without images! <a href="javascript:draw();" style="font-weight: bold;">Try it!</a> <a href="javascript:erase();">Remove it.</a></p>
  <div id="canvas1" style="height: 6cm; min-height: 6cm;"></div>
</div>
<h3>Drag &amp; Drop</h3>
<!--Note:  Must be position: relative! This can really screw IE up!-->
<div id="dragqueen1" style="position:relative; width: 30%;"><p style="background-color: maroon; color: white; border-style: groove; border-color: grey;">Go ahead! Just try to drag me!</p></div>
<p>Hold <span style="font-family: 'Courier New', Courier, monospaced;">Shift</span> and drag to stretch this: <img id="port80" src="../img/bvtelnet80.png" width="119" height="46" /></p>
<h3>Tooltips</h3>
<div>
  <p>Here is a <a href="#" onmouseover="this.T_WIDTH=80; return escape('Got Tooltip?');">simple mouseover tooltip</a>.</p>
  <p>Here is <a href="#" onmouseover="this.T_STICKY=true; this.T_TEMP=3000; this.T_BGCOLOR='#996633'; this.T_FONTCOLOR='#003399'; this.T_BORDERWIDTH=5; this.T_WIDTH=175; this.T_SHADOWWIDTH=10; this.T_TITLE='Link Info'; return escape('Here would be a short but informative explanation of what one might find or invoke by clicking.<br /><a href=\'#\'>More Background Info</a>');" title="Link with Tooltip">a link to something complicated and in need of more explanation</a>, perhaps.
</div>
<br />
<!--NOTE: This script MUST be AFTER all draggables are defined.-->
<script type="text/javascript">
<!-- // <![CDATA[
  SET_DHTML(CURSOR_MOVE, RESIZABLE, "dragqueen1", "port80");
// ]]> -->
</script>
	</body>
	</html>
//


koh5_pano



Your browser does not support the HTML5 canvas element.


Drag mouse to navigate.

Navigation





17.Aug.2010, Martin Wengenmayer