Skip to content

Commit f4ad697

Browse files
plainheartplainheart
committed
test(svg): update test case
1 parent df3b3f3 commit f4ad697

File tree

1 file changed

+65
-51
lines changed

1 file changed

+65
-51
lines changed

‎test/svg-gradient.html‎

Lines changed: 65 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -8,68 +8,82 @@
88
<meta name="viewport" content="width=device-width, initial-scale=1" />
99
</head>
1010
<body>
11-
<div id="main"></div>
11+
<div id="main-svg" style="display: inline-block;"></div>
12+
<div id="main-canvas" style="display: inline-block;"></div>
13+
1214
<script type="text/javascript">
13-
var zr = zrender.init(document.getElementById('main'), {
15+
var zrSVG = zrender.init(document.getElementById('main-svg'), {
1416
renderer: 'svg',
1517
width: 200,
1618
height: 200
1719
});
18-
zr.setBackgroundColor('navajowhite');
1920

20-
var linearGradient1 = new zrender.LinearGradient(0, 0, 0, 1);
21-
linearGradient1.addColorStop(0, 'transparent');
22-
linearGradient1.addColorStop(1, 'orange');
21+
var zrCanvas = zrender.init(document.getElementById('main-canvas'), {
22+
renderer: 'canvas',
23+
width: 200,
24+
height: 200
25+
});
26+
27+
render(zrSVG)
28+
render(zrCanvas)
29+
30+
function render(zr) {
31+
zr.setBackgroundColor('navajowhite');
32+
33+
var linearGradient1 = new zrender.LinearGradient(0, 0, 0, 1);
34+
linearGradient1.addColorStop(0, 'transparent');
35+
linearGradient1.addColorStop(1, 'orange');
2336

24-
var linearGradient2 = new zrender.LinearGradient(0, 0, 0, 1);
25-
linearGradient2.addColorStop(0, 'none');
26-
linearGradient2.addColorStop(1, 'orange');
37+
var linearGradient2 = new zrender.LinearGradient(0, 0, 0, 1);
38+
linearGradient2.addColorStop(0, 'none');
39+
linearGradient2.addColorStop(1, 'orange');
2740

28-
var linearGradient3 = new zrender.LinearGradient(0, 0, 0, 1);
29-
linearGradient3.addColorStop(0, '');
30-
linearGradient3.addColorStop(1, 'orange');
41+
var linearGradient3 = new zrender.LinearGradient(0, 0, 0, 1);
42+
linearGradient3.addColorStop(0, '');
43+
linearGradient3.addColorStop(1, 'orange');
3144

32-
zr.add(
33-
new zrender.Rect({
34-
shape: {
35-
x: 20,
36-
y: 50,
37-
width: 20,
38-
height: 100,
39-
},
40-
style: {
41-
fill: linearGradient1
42-
}
43-
})
44-
);
45+
zr.add(
46+
new zrender.Rect({
47+
shape: {
48+
x: 20,
49+
y: 50,
50+
width: 20,
51+
height: 100,
52+
},
53+
style: {
54+
fill: linearGradient1
55+
}
56+
})
57+
);
4558

46-
zr.add(
47-
new zrender.Rect({
48-
shape: {
49-
x: 60,
50-
y: 50,
51-
width: 20,
52-
height: 100,
53-
},
54-
style: {
55-
fill: linearGradient2
56-
}
57-
})
58-
);
59+
zr.add(
60+
new zrender.Rect({
61+
shape: {
62+
x: 60,
63+
y: 50,
64+
width: 20,
65+
height: 100,
66+
},
67+
style: {
68+
fill: linearGradient2
69+
}
70+
})
71+
);
5972

60-
zr.add(
61-
new zrender.Rect({
62-
shape: {
63-
x: 100,
64-
y: 50,
65-
width: 20,
66-
height: 100,
67-
},
68-
style: {
69-
fill: linearGradient3
70-
}
71-
})
72-
);
73+
zr.add(
74+
new zrender.Rect({
75+
shape: {
76+
x: 100,
77+
y: 50,
78+
width: 20,
79+
height: 100,
80+
},
81+
style: {
82+
fill: linearGradient3
83+
}
84+
})
85+
);
86+
}
7387
</script>
7488
</body>
7589
</html>

0 commit comments

Comments
 (0)