HTMLcopy
1
<div id="container"></div>
CSScopy
6
1
html, body, #container {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
JavaScriptcopy
x
1
var stage = acgraph.create("container");
2
3
stage.rect(22, 2 * stage.height() / 3 - 20, stage.width() - 44, stage.height() / 3 - 22)
4
.fill("none")
5
.stroke("orange", 5, "5 5");
6
7
var step = 30;
8
stage.path()
9
.moveTo(20, 20)
10
.lineTo(20 + step, 20)
11
.moveTo(20 + 2 * step, 20)
12
.lineTo(20 + 3 * step, 20)
13
.moveTo(20 + 4 * step, 20)
14
.lineTo(20 + 5 * step, 20)
15
.moveTo(20 + 6 * step, 20)
16
.lineTo(20 + 7 * step, 20)
17
.moveTo(20 + 8 * step, 20)
18
.lineTo(20 + 9 * step, 20)
19
.moveTo(20 + 10 * step, 20)
20
.lineTo(20 + 11 * step, 20)
21
.moveTo(20 + 12 * step, 20)
22
.lineTo(20 + 13 * step, 20)
23
.moveTo(20, 80)
24
.lineTo(20 + step, 80)
25
.moveTo(20 + 2 * step, 80)
26
.lineTo(20 + 4 * step, 80)
27
.moveTo(20 + 5 * step, 80)
28
.lineTo(20 + 6 * step, 80)
29
.moveTo(20 + 8 * step, 80)
30
.lineTo(20 + 9 * step, 80)
31
.moveTo(20 + 10 * step, 80)
32
.lineTo(20 + 12 * step, 80)
33
.stroke("15 orange");
34
stage.text(20 + step / 2 - 5, 30, "5");
35
stage.text(20 + 3 * step / 2 - 5, 30, "5");
36
stage.text(20 + 5 * step / 2 - 5, 30, "5");
37
stage.text(20 + 7 * step / 2 - 5, 30, "5");
38
stage.text(20 + 9 * step / 2 - 5, 30, "...");
39
stage.text(20 + step / 2 - 5, 55, "5");
40
stage.text(20 + 3 * step / 2 - 5, 55, "5");
41
stage.text(20 + 6 * step / 2 - 5, 55, "10");
42
stage.text(20 + 9 * step / 2 - 5, 55, "5");
43
stage.text(20 + 11 * step / 2 - 5, 55, "5");
44
stage.text(20 + 14 * step / 2 - 5, 55, "10");
45
stage.text(20 + 17 * step / 2 - 5, 55, "5");
46
stage.text(20 + 19 * step / 2 - 5, 55, "...");