wisemapping-frontend/packages/web2d/test/playground/rect.html

109 lines
2.8 KiB
HTML
Raw Normal View History

2021-07-16 16:41:58 +02:00
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
2021-10-03 02:23:32 +02:00
<head>
<style>
th,
td {
border: 1px solid black;
}
</style>
2021-07-16 16:41:58 +02:00
<script type="text/javascript">
web2d = {
peer: {}
};
web2d.peer =
{
svg: {}
};
web2d.peer.utils = {};
</script>
<script type="text/javascript">
function initialize() {
web2d.Toolkit.init();
var rectExampleTest = function () {
var workspace = new web2d.Workspace();
workspace.setSize("100px", "100px");
workspace.setCoordSize(100, 100);
workspace.setCoordOrigin(0, 0);
var rect = new web2d.Rect();
rect.setPosition(20, 20);
workspace.append(rect);
workspace.addItAsChildTo($('#rectExample'));
}
rectExampleTest();
var roundrectExampleTest = function () {
function builder(container, x, width, height) {
for (var i = 1; i <= 10; i++) {
var rect = new web2d.Rect(i / 10);
rect.setPosition(x, ((i - 1) * (50 + 5)));
rect.setSize(width, height);
container.append(rect);
}
}
// 50 x 50
var workspace = new web2d.Workspace();
workspace.setSize("500px", "550px");
workspace.setCoordOrigin(0, -4);
workspace.setCoordSize(500, 550);
workspace.addItAsChildTo($('#roundRect'));
builder(workspace, 10, 50, 50);
// 100 x 50
builder(workspace, 70, 100, 50);
// 200 x 50
builder(workspace, 180, 200, 50);
}
roundrectExampleTest();
}
</script>
</head>
<body onload="initialize();">
2021-10-03 02:23:32 +02:00
<h1>Rect Render Tests </h1>
2021-07-16 16:41:58 +02:00
2021-10-03 02:23:32 +02:00
<table>
<colgroup style="width:80%;">
<col style="width:10%" />
<col style="width:90%" />
</colgroup>
<tr>
<td>
Straight Lines.
</td>
<td>
<div id="rectExample"></div>
</td>
2021-07-16 16:41:58 +02:00
2021-10-03 02:23:32 +02:00
</tr>
2021-07-16 16:41:58 +02:00
2021-10-03 02:23:32 +02:00
<!-- ********************************************************** -->
<tr>
<td>
Straight Lines.
</td>
<td>
<div id="roundRect" style="float:left;margin:10px"></div>
</td>
2021-07-16 16:41:58 +02:00
2021-10-03 02:23:32 +02:00
</tr>
2021-07-16 16:41:58 +02:00
2021-10-03 02:23:32 +02:00
</table>
2021-07-16 16:41:58 +02:00
</body>
2021-10-03 02:23:32 +02:00
</html>