mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2025-06-11 18:43:22 +02:00
Remove javascript folder structure
This commit is contained in:
141
packages/web2d/test/playground/line.html
Executable file
141
packages/web2d/test/playground/line.html
Executable file
@ -0,0 +1,141 @@
|
||||
<!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">
|
||||
|
||||
<head>
|
||||
<style>
|
||||
th,
|
||||
td {
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
web2d = {
|
||||
peer: {}
|
||||
};
|
||||
|
||||
web2d.peer =
|
||||
{
|
||||
svg: {}
|
||||
};
|
||||
|
||||
web2d.peer.utils = {};
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
function initialize() {
|
||||
web2d.Toolkit.init();
|
||||
var workspaceAttributes = { width: '700px', height: '100px', coordSize: '350 50', fillColor: '#ffffcc' };
|
||||
var strokeWidthWorkspace = new web2d.Workspace(workspaceAttributes);
|
||||
|
||||
var rect = new web2d.Rect();
|
||||
rect.setSize(10, 10);
|
||||
rect.setStroke(0);
|
||||
rect.setPosition(250, 5);
|
||||
strokeWidthWorkspace.append(rect);
|
||||
|
||||
for (var i = 0; i <= 10; i++) {
|
||||
var line = new web2d.Line();
|
||||
line.setFrom(5 + (i * 25), 5);
|
||||
line.setTo(5 + (i * 25), 45);
|
||||
line.setAttribute('strokeWidth', i + 1);
|
||||
strokeWidthWorkspace.append(line);
|
||||
}
|
||||
strokeWidthWorkspace.append(rect);
|
||||
|
||||
strokeWidthWorkspace.addItAsChildTo($('#strokeWidthSample'));
|
||||
|
||||
var strokeOpacityWorkspace = new web2d.Workspace(workspaceAttributes);
|
||||
for (var i = 0; i < 10; i++) {
|
||||
var line = new web2d.Line();
|
||||
line.setFrom(15 + (i * 25), 5);
|
||||
line.setTo(3 + (i * 25), 45);
|
||||
line.setAttribute('strokeWidth', 2);
|
||||
line.setAttribute('strokeOpacity', 1 / (i + 1));
|
||||
line.setAttribute('strokeColor', 'red');
|
||||
strokeOpacityWorkspace.append(line);
|
||||
}
|
||||
strokeOpacityWorkspace.addItAsChildTo($('#strokeOpacitySample'));
|
||||
|
||||
var strokeStyleWorkspace = new web2d.Workspace(workspaceAttributes);
|
||||
var styles = ['solid', 'dot', 'dash', 'dashdot', 'longdash'];
|
||||
for (var i = 0; i < styles.length; i++) {
|
||||
var line = new web2d.Line();
|
||||
line.setFrom(25 + (i * 30), 5);
|
||||
line.setTo(13 + (i * 30), 45);
|
||||
line.setAttribute('strokeWidth', 2);
|
||||
line.setAttribute('strokeColor', 'red');
|
||||
line.setAttribute('strokeStyle', styles[i]);
|
||||
strokeStyleWorkspace.append(line);
|
||||
}
|
||||
strokeStyleWorkspace.addItAsChildTo($('#strokeStyleSample'));
|
||||
|
||||
var strokeArrowWorkspace = new web2d.Workspace(workspaceAttributes);
|
||||
var styles = ['none ', 'block ', 'classic', 'diamond ', 'oval', 'open', 'chevron', 'doublechevron'];
|
||||
for (var i = 0; i < styles.length; i++) {
|
||||
var line = new web2d.Line();
|
||||
line.setFrom(25 + (i * 30), 5);
|
||||
line.setTo(13 + (i * 30), 45);
|
||||
line.setAttribute('strokeWidth', 2);
|
||||
line.setAttribute('strokeColor', 'red');
|
||||
line.setArrowStyle(styles[i]);
|
||||
strokeArrowWorkspace.append(line);
|
||||
}
|
||||
strokeArrowWorkspace.addItAsChildTo($('#strokeArrowSample'));
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="initialize();">
|
||||
|
||||
<h1>Lines Render Tests </h1>
|
||||
|
||||
<table>
|
||||
<colgroup style="width:80%;">
|
||||
<col style="width:30%" />
|
||||
<col style="width:60%" />
|
||||
</colgroup>
|
||||
<tr>
|
||||
<td>
|
||||
Lines.
|
||||
</td>
|
||||
<td>
|
||||
<div id="strokeWidthSample" />
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Lines Opacity.
|
||||
</td>
|
||||
<td>
|
||||
<div id="strokeOpacitySample" />
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Line Styles.
|
||||
</td>
|
||||
<td>
|
||||
<div id="strokeStyleSample" />
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Line Arrows.
|
||||
</td>
|
||||
<td>
|
||||
<div id="strokeArrowSample" />
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
</body>
|
||||
|
||||
</html>
|
Reference in New Issue
Block a user