Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(55)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: tools/pathops_sorter.htm

Issue 1037953004: add conics to path ops (Closed) Base URL: https://skia.googlesource.com/skia.git@master
Patch Set: turn off pathops specific debuggging Created 5 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « tests/PathOpsTestCommon.cpp ('k') | tools/pathops_visualizer.htm » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 2
3 <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 3 <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
4 <head> 4 <head>
5 <meta charset="utf-8" /> 5 <meta charset="utf-8" />
6 <title></title> 6 <title></title>
7 <div style="height:0"> 7 <div style="height:0">
8
8 <div id="sect1"> 9 <div id="sect1">
9 {{{1.80943513, 3.0778243500000002}, {1.66686702, 2.1680693600000001}, {1.6830127 2, 0}, {3, 0}}} id=1 10 {{{3, 0}, {0, 1}, {1, 2}}},
10 {{{0, 1}, {0, 2}, {0.75, 2.25}, {1.75, 2.25}}} id=2 11 {{{1, 1}, {0, 2}, {3, 3}}},
11 {{{1.75, 2.25}, {2.75, 2.25}, {4, 2}, {5, 2}}} id=4
12 </div>
13
14 <div id="sect2">
15 {{{1.80943513, 3.0778243500000002}, {1.66686702, 2.1680693600000001}, {1.6830127 2, 0}, {3, 0}}} id=1
16 {{{0, 1}, {0, 2}, {0.75, 2.25}, {1.75, 2.25}}} id=2
17 {{{1.75, 2.25}, {2.2500000000000018, 2.25}, {2.8124999999999991, 2.1875}, {3.375 , 2.125}}} id=4
18 </div>
19
20 <div id="sect3">
21 {{{1.80943513, 3.0778243500000002}, {1.738151075, 2.6229468550000004}, {1.706545 4725, 1.8534907675000001}, {1.85738429375, 1.19775405375}}} id=1
22 {{{0, 1}, {0, 2}, {0.75, 2.25}, {1.75, 2.25}}} id=2
23 {{{1.75, 2.25}, {2.2500000000000018, 2.25}, {2.8124999999999991, 2.1875}, {3.375 , 2.125}}} id=4
24 </div>
25
26 <div id="sect4">
27 {{{1.80943513, 3.0778243500000002}, {1.7737931025, 2.8503856025000003}, {1.74807 06881249999, 2.5443022068750003}, {1.7501136332812499, 2.2131114089062502}}} id= 1
28 {{{0, 1}, {0, 2}, {0.75, 2.25}, {1.75, 2.25}}} id=2
29 {{{1.75, 2.25}, {2.2500000000000018, 2.25}, {2.8124999999999991, 2.1875}, {3.375 , 2.125}}} id=4
30 </div>
31
32 <div id="sect5">
33 {{{1.80943513, 3.0778243500000002}, {1.7737931025, 2.8503856025000003}, {1.74807 06881249999, 2.5443022068750003}, {1.7501136332812499, 2.2131114089062502}}} id= 1
34 {{{0.5, 2}, {0.81249999999999956, 2.1874999999999987}, {1.2500000000000009, 2.25 00000000000013}, {1.75, 2.25}}} id=8
35 {{{1.75, 2.25}, {2.2500000000000018, 2.25}, {2.8124999999999991, 2.1875}, {3.375 , 2.125}}} id=4
36 </div>
37
38 <div id="sect6">
39 {{{1.80943513, 3.0778243500000002}, {1.7737931025, 2.8503856025000003}, {1.74807 06881249999, 2.5443022068750003}, {1.7501136332812499, 2.2131114089062502}}} id= 1
40 {{{0.5, 2}, {0.81249999999999956, 2.1874999999999987}, {1.2500000000000009, 2.25 00000000000013}, {1.75, 2.25}}} id=8
41 {{{1.75, 2.25}, {1.9999999999999976, 2.25}, {2.2656250000000022, 2.234375}, {2.5 390625, 2.2109375}}} id=4
42 </div>
43
44 <div id="sect7">
45 {{{1.80943513, 3.0778243500000002}, {1.7737931025, 2.8503856025000003}, {1.74807 06881249999, 2.5443022068750003}, {1.7501136332812499, 2.2131114089062502}}} id= 1
46 {{{1.0546875, 2.1953125}, {1.2656250000000009, 2.2343750000000009}, {1.499999999 9999996, 2.2499999999999996}, {1.75, 2.25}}} id=12
47 {{{1.75, 2.25}, {1.9999999999999976, 2.25}, {2.2656250000000022, 2.234375}, {2.5 390625, 2.2109375}}} id=4
48 </div>
49
50 <div id="sect8">
51 {{{1.7656425168945311, 2.6843748983789064}, {1.7550120280078125, 2.5380253562890 633}, {1.7490921607031253, 2.3787068078906248}, {1.7501136332812499, 2.213111408 9062502}}} id=7
52 {{{1.0546875, 2.1953125}, {1.2656250000000009, 2.2343750000000009}, {1.499999999 9999996, 2.2499999999999996}, {1.75, 2.25}}} id=12
53 {{{1.75, 2.25}, {1.9999999999999976, 2.25}, {2.2656250000000022, 2.234375}, {2.5 390625, 2.2109375}}} id=4
54 </div>
55
56 <div id="sect9">
57 {{{1.7656425168945311, 2.6843748983789064}, {1.7550120280078125, 2.5380253562890 633}, {1.7490921607031253, 2.3787068078906248}, {1.7501136332812499, 2.213111408 9062502}}} id=7
58 {{{1.0546875, 2.1953125}, {1.2656250000000009, 2.2343750000000009}, {1.499999999 9999996, 2.2499999999999996}, {1.75, 2.25}}} id=12
59 {{{1.75, 2.25}, {1.8750000000000016, 2.2499999999999991}, {2.0039062499999982, 2 .2460937500000004}, {2.1357421875, 2.2392578125}}} id=4
60 </div>
61
62 <div id="sect10">
63 {{{1.7656425168945311, 2.6843748983789064}, {1.7550120280078125, 2.5380253562890 633}, {1.7490921607031253, 2.3787068078906248}, {1.7501136332812499, 2.213111408 9062502}}} id=7
64 {{{1.3876953125, 2.2373046875}, {1.50390625, 2.24609375}, {1.625, 2.25}, {1.75, 2.25}}} id=16
65 {{{1.75, 2.25}, {1.8750000000000016, 2.2499999999999991}, {2.0039062499999982, 2 .2460937500000004}, {2.1357421875, 2.2392578125}}} id=4
66 </div>
67
68 <div id="sect11">
69 {{{1.7535085895385742, 2.4559603499780276}, {1.7508274956738286, 2.3771375952441 409}, {1.7496028969921869, 2.2959091083984369}, {1.7501136332812499, 2.213111408 9062502}}} id=9
70 {{{1.3876953125, 2.2373046875}, {1.50390625, 2.24609375}, {1.625, 2.25}, {1.75, 2.25}}} id=16
71 {{{1.75, 2.25}, {1.8750000000000016, 2.2499999999999991}, {2.0039062499999982, 2 .2460937500000004}, {2.1357421875, 2.2392578125}}} id=4
72 </div>
73
74 <div id="sect12">
75 {{{1.7535085895385742, 2.4559603499780276}, {1.7508274956738286, 2.3771375952441 409}, {1.7496028969921869, 2.2959091083984369}, {1.7501136332812499, 2.213111408 9062502}}} id=9
76 {{{1.3876953125, 2.2373046875}, {1.50390625, 2.24609375}, {1.625, 2.25}, {1.75, 2.25}}} id=16
77 {{{1.75, 2.25}, {1.8124999999999989, 2.2499999999999996}, {1.8759765625000011, 2 .2490234374999996}, {1.9403076171875, 2.2471923828125}}} id=4
78 </div>
79
80 <div id="sect13">
81 {{{1.7535085895385742, 2.4559603499780276}, {1.7508274956738286, 2.3771375952441 409}, {1.7496028969921869, 2.2959091083984369}, {1.7501136332812499, 2.213111408 9062502}}} id=9
82 {{{1.5655517578125, 2.2469482421875}, {1.6259765625, 2.2490234375}, {1.6875, 2.2 5}, {1.75, 2.25}}} id=20
83 {{{1.75, 2.25}, {1.8124999999999989, 2.2499999999999996}, {1.8759765625000011, 2 .2490234374999996}, {1.9403076171875, 2.2471923828125}}} id=4
84 </div>
85
86 <div id="sect14">
87 {{{1.7506141751022339, 2.3360264837265015}, {1.7500367307348632, 2.2955168052368 169}, {1.7498582651367187, 2.2545102586523438}, {1.7501136332812499, 2.213111408 9062502}}} id=11
88 {{{1.5655517578125, 2.2469482421875}, {1.6259765625, 2.2490234375}, {1.6875, 2.2 5}, {1.75, 2.25}}} id=20
89 {{{1.75, 2.25}, {1.8124999999999989, 2.2499999999999996}, {1.8759765625000011, 2 .2490234374999996}, {1.9403076171875, 2.2471923828125}}} id=4
90 </div>
91
92 <div id="sect15">
93 {{{1.7506141751022339, 2.3360264837265015}, {1.7500367307348632, 2.2955168052368 169}, {1.7498582651367187, 2.2545102586523438}, {1.7501136332812499, 2.213111408 9062502}}} id=11
94 {{{1.5655517578125, 2.2469482421875}, {1.6259765625, 2.2490234375}, {1.6875, 2.2 5}, {1.75, 2.25}}} id=20
95 {{{1.75, 2.25}, {1.7812500000000011, 2.2500000000000004}, {1.8127441406249989, 2 .2497558593749991}, {1.8444671630859375, 2.2492828369140625}}} id=4
96 </div>
97
98 <div id="sect16">
99 {{{1.7506141751022339, 2.3360264837265015}, {1.7500367307348632, 2.2955168052368 169}, {1.7498582651367187, 2.2545102586523438}, {1.7501136332812499, 2.213111408 9062502}}} id=11
100 {{{1.6569976806640625, 2.2492523193359375}, {1.687744140625, 2.249755859375}, {1 .71875, 2.25}, {1.75, 2.25}}} id=24
101 {{{1.75, 2.25}, {1.7812500000000011, 2.2500000000000004}, {1.8127441406249989, 2 .2497558593749991}, {1.8444671630859375, 2.2492828369140625}}} id=4
102 </div>
103
104 <div id="sect17">
105 {{{1.7500515994997787, 2.274902385537529}, {1.7499667235723877, 2.25441218286193 79}, {1.7499859492089846, 2.2338108337792986}, {1.7501136332812499, 2.2131114089 062502}}} id=13
106 {{{1.6569976806640625, 2.2492523193359375}, {1.687744140625, 2.249755859375}, {1 .71875, 2.25}, {1.75, 2.25}}} id=24
107 {{{1.75, 2.25}, {1.7812500000000011, 2.2500000000000004}, {1.8127441406249989, 2 .2497558593749991}, {1.8444671630859375, 2.2492828369140625}}} id=4
108 </div>
109
110 <div id="sect18">
111 {{{1.7500515994997787, 2.274902385537529}, {1.7499667235723877, 2.25441218286193 79}, {1.7499859492089846, 2.2338108337792986}, {1.7501136332812499, 2.2131114089 062502}}} id=13
112 {{{1.6569976806640625, 2.2492523193359375}, {1.687744140625, 2.249755859375}, {1 .71875, 2.25}, {1.75, 2.25}}} id=24
113 {{{1.75, 2.25}, {1.7656249999999989, 2.25}, {1.7813110351562511, 2.2499389648437 5}, {1.7970561981201172, 2.2498188018798828}}} id=4
114 </div>
115
116 <div id="sect19">
117 {{{1.7500515994997787, 2.274902385537529}, {1.7499667235723877, 2.25441218286193 79}, {1.7499859492089846, 2.2338108337792986}, {1.7501136332812499, 2.2131114089 062502}}} id=13
118 {{{1.7033100128173828, 2.2498149871826172}, {1.7188110351562504, 2.2499389648437 504}, {1.7343749999999991, 2.2499999999999991}, {1.75, 2.25}}} id=28
119 {{{1.75, 2.25}, {1.7656249999999989, 2.25}, {1.7813110351562511, 2.2499389648437 5}, {1.7970561981201172, 2.2498188018798828}}} id=4
120 </div>
121
122 <div id="sect20">
123 {{{1.7500515994997787, 2.274902385537529}, {1.7500091615360831, 2.26465728419973 37}, {1.7499927489633849, 2.2543843962601757}, {1.7500029063906433, 2.2440853555 459359}}} id=13
124 {{{1.7033100128173828, 2.2498149871826172}, {1.7188110351562504, 2.2499389648437 504}, {1.7343749999999991, 2.2499999999999991}, {1.75, 2.25}}} id=28
125 {{{1.75, 2.25}, {1.7656249999999989, 2.25}, {1.7813110351562511, 2.2499389648437 5}, {1.7970561981201172, 2.2498188018798828}}} id=4
126 </div>
127
128 <div id="sect21">
129 {{{1.7500515994997787, 2.274902385537529}, {1.7500091615360831, 2.26465728419973 37}, {1.7499927489633849, 2.2543843962601757}, {1.7500029063906433, 2.2440853555 459359}}} id=13
130 {{{1.7033100128173828, 2.2498149871826172}, {1.7188110351562504, 2.2499389648437 504}, {1.7343749999999991, 2.2499999999999991}, {1.75, 2.25}}} id=28
131 {{{1.75, 2.25}, {1.7578125000000004, 2.25}, {1.7656402587890616, 2.2499847412109 375}, {1.7734830379486084, 2.2499544620513916}}} id=4
132 </div>
133
134 <div id="sect22">
135 {{{1.7500515994997787, 2.274902385537529}, {1.7500091615360831, 2.26465728419973 37}, {1.7499927489633849, 2.2543843962601757}, {1.7500029063906433, 2.2440853555 459359}}} id=13
136 {{{1.7266085147857666, 2.2499539852142334}, {1.7343902587890614, 2.2499847412109 362}, {1.7421875000000011, 2.2500000000000013}, {1.75, 2.25}}} id=32
137 {{{1.75, 2.25}, {1.7578125000000004, 2.25}, {1.7656402587890616, 2.2499847412109 375}, {1.7734830379486084, 2.2499544620513916}}} id=4
138 </div>
139
140 <div id="sect23">
141 {{{1.7500075296736033, 2.2595140978078994}, {1.749999391463374, 2.25437785806650 53}, {1.7499978276770138, 2.2492348759030554}, {1.7500029063906433, 2.2440853555 459359}}} id=17
142 {{{1.7266085147857666, 2.2499539852142334}, {1.7343902587890614, 2.2499847412109 362}, {1.7421875000000011, 2.2500000000000013}, {1.75, 2.25}}} id=32
143 {{{1.75, 2.25}, {1.7578125000000004, 2.25}, {1.7656402587890616, 2.2499847412109 375}, {1.7734830379486084, 2.2499544620513916}}} id=4
144 </div>
145
146 <div id="sect24">
147 {{{1.7500075296736033, 2.2595140978078994}, {1.749999391463374, 2.25437785806650 53}, {1.7499978276770138, 2.2492348759030554}, {1.7500029063906433, 2.2440853555 459359}}} id=17
148 {{{1.7266085147857666, 2.2499539852142334}, {1.7343902587890614, 2.2499847412109 362}, {1.7421875000000011, 2.2500000000000013}, {1.75, 2.25}}} id=32
149 {{{1.75, 2.25}, {1.7539062499999991, 2.25}, {1.7578163146972661, 2.2499961853027 344}, {1.7617301642894745, 2.2499885857105255}}} id=4
150 </div>
151
152 <div id="sect25">
153 {{{1.7500075296736033, 2.2595140978078994}, {1.749999391463374, 2.25437785806650 53}, {1.7499978276770138, 2.2492348759030554}, {1.7500029063906433, 2.2440853555 459359}}} id=17
154 {{{1.7382927238941193, 2.2499885261058807}, {1.7421913146972665, 2.2499961853027 353}, {1.7460937499999996, 2.2499999999999996}, {1.75, 2.25}}} id=36
155 {{{1.75, 2.25}, {1.7539062499999991, 2.25}, {1.7578163146972661, 2.2499961853027 344}, {1.7617301642894745, 2.2499885857105255}}} id=4
156 </div>
157
158 <div id="sect26">
159 {{{1.7500002616856762, 2.2518047069078144}, {1.7499994883020116, 2.2492332413546 396}, {1.7500003670338282, 2.2466601157244943}, {1.7500029063906433, 2.244085355 5459359}}} id=19
160 {{{1.75, 2.25}, {1.7539062499999991, 2.25}, {1.7578163146972661, 2.2499961853027 344}, {1.7617301642894745, 2.2499885857105255}}} id=4
161 </div>
162
163 <div id="sect27">
164 {{{1.7500002616856762, 2.2518047069078144}, {1.7499994883020116, 2.2492332413546 396}, {1.7500003670338282, 2.2466601157244943}, {1.7500029063906433, 2.244085355 5459359}}} id=19
165 {{{1.75, 2.25}, {1.7519531250000011, 2.2499999999999991}, {1.7539072036743153, 2 .249999046325684}, {1.7558622322976589, 2.2499971427023411}}} id=4
166 </div>
167
168 <div id="sect28">
169 {{{1.7500002616856762, 2.2518047069078144}, {1.749999874993843, 2.25051897413122 73}, {1.7499999013308822, 2.2492328263353962}, {1.7500003417604797, 2.2479462667 113941}}} id=19
170 {{{1.75, 2.25}, {1.7519531250000011, 2.2499999999999991}, {1.7539072036743153, 2 .249999046325684}, {1.7558622322976589, 2.2499971427023411}}} id=4
171 </div>
172
173 <div id="sect29">
174 {{{1.7500002616856762, 2.2518047069078144}, {1.749999874993843, 2.25051897413122 73}, {1.7499999013308822, 2.2492328263353962}, {1.7500003417604797, 2.2479462667 113941}}} id=19
175 {{{1.75, 2.25}, {1.7509765624999989, 2.2499999999999996}, {1.7519533634185802, 2 .2499997615814205}, {1.752930402290076, 2.249999285209924}}} id=4
176 </div>
177
178 <div id="sect30">
179 {{{1.7500002616856762, 2.2518047069078144}, {1.7500000683397601, 2.2511618405195 208}, {1.7499999782510609, 2.2505188703764163}, {1.7499999915525417, 2.249875796 8773848}}} id=19
180 {{{1.75, 2.25}, {1.7509765624999989, 2.2499999999999996}, {1.7519533634185802, 2 .2499997615814205}, {1.752930402290076, 2.249999285209924}}} id=4
181 </div>
182
183 <div id="sect31">
184 {{{1.7500002616856762, 2.2518047069078144}, {1.7500000683397601, 2.2511618405195 208}, {1.7499999782510609, 2.2505188703764163}, {1.7499999915525417, 2.249875796 8773848}}} id=19
185 {{{1.75, 2.25}, {1.7504882812500011, 2.2500000000000004}, {1.7509766221046437, 2 .2499999403953543}, {1.7514650225057267, 2.2499998212442733}}} id=4
186 </div>
187
188 <div id="sect32">
189 {{{1.7500000491263352, 2.2508403295591259}, {1.7500000040986061, 2.2505188445374 351}, {1.7499999849018013, 2.2501973336269003}, {1.7499999915525417, 2.249875796 8773848}}} id=25
190 {{{1.75, 2.25}, {1.7504882812500011, 2.2500000000000004}, {1.7509766221046437, 2 .2499999403953543}, {1.7514650225057267, 2.2499998212442733}}} id=4
191 </div>
192
193 <div id="sect33">
194 {{{1.7500000491263352, 2.2508403295591259}, {1.7500000040986061, 2.2505188445374 351}, {1.7499999849018013, 2.2501973336269003}, {1.7499999915525417, 2.249875796 8773848}}} id=25
195 {{{1.75, 2.25}, {1.7502441406249989, 2.25}, {1.7504882961511623, 2.2499999850988 388}, {1.7507324665712076, 2.2499999553037924}}} id=4
196 </div>
197
198 <div id="sect34">
199 {{{1.7500000009600125, 2.2503580826161893}, {1.7499999913636877, 2.2501973271671 556}, {1.7499999882271713, 2.2500365652521426}, {1.7499999915525417, 2.249875796 8773848}}} id=27
200 {{{1.75, 2.25}, {1.7502441406249989, 2.25}, {1.7504882961511623, 2.2499999850988 388}, {1.7507324665712076, 2.2499999553037924}}} id=4
201 </div>
202
203 <div id="sect35">
204 {{{1.7500000009600125, 2.2503580826161893}, {1.7499999913636877, 2.2501973271671 556}, {1.7499999882271713, 2.2500365652521426}, {1.7499999915525417, 2.249875796 8773848}}} id=27
205 {{{1.75, 2.25}, {1.7501220703125004, 2.25}, {1.7502441443502894, 2.2499999962747 097}, {1.7503662221124614, 2.2499999888250386}}} id=4
206 </div>
207
208 <div id="sect36">
209 </div> 12 </div>
210 13
211 </div> 14 </div>
212 15
213 <script type="text/javascript"> 16 <script type="text/javascript">
214 17
215 var testDivs = [ 18 var testDivs = [
216 sect1, 19 sect1,
217 sect2,
218 sect3,
219 sect4,
220 sect5,
221 sect6,
222 sect7,
223 sect8,
224 sect9,
225 sect10,
226 sect11,
227 sect12,
228 sect13,
229 sect14,
230 sect15,
231 sect16,
232 sect17,
233 sect18,
234 sect19,
235 sect20,
236 sect21,
237 sect22,
238 sect23,
239 sect24,
240 sect25,
241 sect26,
242 sect27,
243 sect28,
244 sect29,
245 sect30,
246 sect31,
247 sect32,
248 sect33,
249 sect34,
250 sect35,
251 sect36,
252 20
253 21 ];
254 ];
255 22
256 var decimal_places = 3; 23 var decimal_places = 3;
257 24
258 var tests = []; 25 var tests = [];
259 var testTitles = []; 26 var testTitles = [];
260 var testIndex = 0; 27 var testIndex = 0;
261 var ctx; 28 var ctx;
262 29
263 var subscale = 1; 30 var subscale = 1;
264 var xmin, xmax, ymin, ymax; 31 var xmin, xmax, ymin, ymax;
265 var scale; 32 var scale;
266 var initScale; 33 var initScale;
267 var mouseX, mouseY; 34 var mouseX, mouseY;
268 var mouseDown = false; 35 var mouseDown = false;
269 var srcLeft, srcTop; 36 var srcLeft, srcTop;
270 var screenWidth, screenHeight; 37 var screenWidth, screenHeight;
271 var drawnPts; 38 var drawnPts;
272 var curveT = 0; 39 var curveT = 0;
40 var curveW = -1;
273 41
274 var lastX, lastY; 42 var lastX, lastY;
275 var activeCurve = []; 43 var activeCurve = [];
276 var activePt; 44 var activePt;
277 var ids = []; 45 var ids = [];
278 46
279 var focus_on_selection = 0; 47 var focus_on_selection = 0;
280 var draw_t = false; 48 var draw_t = false;
49 var draw_w = false;
281 var draw_closest_t = false; 50 var draw_closest_t = false;
282 var draw_cubic_red = false; 51 var draw_cubic_red = false;
283 var draw_derivative = false; 52 var draw_derivative = false;
284 var draw_endpoints = 2; 53 var draw_endpoints = 2;
285 var draw_id = false; 54 var draw_id = 0;
286 var draw_midpoint = 0; 55 var draw_midpoint = 0;
287 var draw_mouse_xy = false; 56 var draw_mouse_xy = false;
288 var draw_order = false; 57 var draw_order = false;
289 var draw_point_xy = false; 58 var draw_point_xy = false;
290 var draw_ray_intersect = false; 59 var draw_ray_intersect = false;
291 var draw_quarterpoint = 0; 60 var draw_quarterpoint = 0;
292 var draw_tangents = 1; 61 var draw_tangents = 1;
293 var draw_sortpoint = 0; 62 var draw_sortpoint = 0;
294 var retina_scale = !!window.devicePixelRatio; 63 var retina_scale = !!window.devicePixelRatio;
295 64
(...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after
341 canvas.style.height = unscaledHeight + 'px'; 110 canvas.style.height = unscaledHeight + 'px';
342 if (resScale != 1) { 111 if (resScale != 1) {
343 ctx.scale(resScale, resScale); 112 ctx.scale(resScale, resScale);
344 } 113 }
345 xmin = Infinity; 114 xmin = Infinity;
346 xmax = -Infinity; 115 xmax = -Infinity;
347 ymin = Infinity; 116 ymin = Infinity;
348 ymax = -Infinity; 117 ymax = -Infinity;
349 for (var curves in test) { 118 for (var curves in test) {
350 var curve = test[curves]; 119 var curve = test[curves];
351 var last = curve.length; 120 var last = curve.length - (curve.length % 2 == 1 ? 1 : 0);
352 for (var idx = 0; idx < last; idx += 2) { 121 for (var idx = 0; idx < last; idx += 2) {
353 xmin = Math.min(xmin, curve[idx]); 122 xmin = Math.min(xmin, curve[idx]);
354 xmax = Math.max(xmax, curve[idx]); 123 xmax = Math.max(xmax, curve[idx]);
355 ymin = Math.min(ymin, curve[idx + 1]); 124 ymin = Math.min(ymin, curve[idx + 1]);
356 ymax = Math.max(ymax, curve[idx + 1]); 125 ymax = Math.max(ymax, curve[idx + 1]);
357 } 126 }
358 } 127 }
359 xmin -= Math.min(1, Math.max(xmax - xmin, ymax - ymin)); 128 xmin -= Math.min(1, Math.max(xmax - xmin, ymax - ymin));
360 var testW = xmax - xmin; 129 var testW = xmax - xmin;
361 var testH = ymax - ymin; 130 var testH = ymax - ymin;
(...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after
398 } 167 }
399 168
400 function dxy_at_t(curve, t) { 169 function dxy_at_t(curve, t) {
401 var dxy = {}; 170 var dxy = {};
402 if (curve.length == 6) { 171 if (curve.length == 6) {
403 var a = t - 1; 172 var a = t - 1;
404 var b = 1 - 2 * t; 173 var b = 1 - 2 * t;
405 var c = t; 174 var c = t;
406 dxy.x = a * curve[0] + b * curve[2] + c * curve[4]; 175 dxy.x = a * curve[0] + b * curve[2] + c * curve[4];
407 dxy.y = a * curve[1] + b * curve[3] + c * curve[5]; 176 dxy.y = a * curve[1] + b * curve[3] + c * curve[5];
177 } else if (curve.length == 7) {
178 var p20x = curve[4] - curve[0];
179 var p20y = curve[5] - curve[1];
180 var p10xw = (curve[2] - curve[0]) * curve[6];
181 var p10yw = (curve[3] - curve[1]) * curve[6];
182 var coeff0x = curve[6] * p20x - p20x;
183 var coeff0y = curve[6] * p20y - p20y;
184 var coeff1x = p20x - 2 * p10xw;
185 var coeff1y = p20y - 2 * p10yw;
186 dxy.x = t * (t * coeff0x + coeff1x) + p10xw;
187 dxy.y = t * (t * coeff0y + coeff1y) + p10yw;
408 } else if (curve.length == 8) { 188 } else if (curve.length == 8) {
409 var one_t = 1 - t; 189 var one_t = 1 - t;
410 var a = curve[0]; 190 var a = curve[0];
411 var b = curve[2]; 191 var b = curve[2];
412 var c = curve[4]; 192 var c = curve[4];
413 var d = curve[6]; 193 var d = curve[6];
414 dxy.x = 3 * ((b - a) * one_t * one_t + 2 * (c - b) * t * one_t + (d - c) * t * t); 194 dxy.x = 3 * ((b - a) * one_t * one_t + 2 * (c - b) * t * one_t + (d - c) * t * t);
415 a = curve[1]; 195 a = curve[1];
416 b = curve[3]; 196 b = curve[3];
417 c = curve[5]; 197 c = curve[5];
(...skipping 104 matching lines...) Expand 10 before | Expand all | Expand 10 after
522 if (R > 0) { 302 if (R > 0) {
523 A = -A; 303 A = -A;
524 } 304 }
525 if (A != 0) { 305 if (A != 0) {
526 A += Q / A; 306 A += Q / A;
527 } 307 }
528 r = A - adiv3; 308 r = A - adiv3;
529 roots.push(r); 309 roots.push(r);
530 if (approximately_zero(R2 - Q3)) { 310 if (approximately_zero(R2 - Q3)) {
531 r = -A / 2 - adiv3; 311 r = -A / 2 - adiv3;
532 if (!approximately_zero(s[0] - r)) { 312 if (!approximately_zero(roots[0] - r)) {
533 roots.push(r); 313 roots.push(r);
534 } 314 }
535 } 315 }
536 } 316 }
537 return roots; 317 return roots;
538 } 318 }
539 319
540 function approximately_zero_or_more(tValue) { 320 function approximately_zero_or_more(tValue) {
541 return tValue >= -flt_epsilon; 321 return tValue >= -flt_epsilon;
542 } 322 }
(...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after
584 function cubic_roots(A, B, C, D) { 364 function cubic_roots(A, B, C, D) {
585 var s = cubic_real_roots(A, B, C, D); 365 var s = cubic_real_roots(A, B, C, D);
586 var foundRoots = add_valid_ts(s); 366 var foundRoots = add_valid_ts(s);
587 return foundRoots; 367 return foundRoots;
588 } 368 }
589 369
590 function ray_curve_intersect(startPt, endPt, curve) { 370 function ray_curve_intersect(startPt, endPt, curve) {
591 var adj = endPt[0] - startPt[0]; 371 var adj = endPt[0] - startPt[0];
592 var opp = endPt[1] - startPt[1]; 372 var opp = endPt[1] - startPt[1];
593 var r = []; 373 var r = [];
594 for (var n = 0; n < curve.length / 2; ++n) { 374 var len = (curve.length == 7 ? 6 : curve.length) / 2;
375 for (var n = 0; n < len; ++n) {
595 r[n] = (curve[n * 2 + 1] - startPt[1]) * adj - (curve[n * 2] - start Pt[0]) * opp; 376 r[n] = (curve[n * 2 + 1] - startPt[1]) * adj - (curve[n * 2] - start Pt[0]) * opp;
596 } 377 }
597 if (curve.length == 6) { 378 if (curve.length == 6) {
598 var A = r[2]; 379 var A = r[2];
599 var B = r[1]; 380 var B = r[1];
600 var C = r[0]; 381 var C = r[0];
601 A += C - 2 * B; // A = a - 2*b + c 382 A += C - 2 * B; // A = a - 2*b + c
602 B -= C; // B = -(b - c) 383 B -= C; // B = -(b - c)
603 return quad_roots(A, 2 * B, C); 384 return quad_roots(A, 2 * B, C);
604 } 385 }
386 if (curve.length == 7) {
387 var A = r[2];
388 var B = r[1] * curve[6];
389 var C = r[0];
390 A += C - 2 * B; // A = a - 2*b + c
391 B -= C; // B = -(b - c)
392 return quad_roots(A, 2 * B, C);
393 }
605 var A = r[3]; // d 394 var A = r[3]; // d
606 var B = r[2] * 3; // 3*c 395 var B = r[2] * 3; // 3*c
607 var C = r[1] * 3; // 3*b 396 var C = r[1] * 3; // 3*b
608 var D = r[0]; // a 397 var D = r[0]; // a
609 A -= D - C + B; // A = -a + 3*b - 3*c + d 398 A -= D - C + B; // A = -a + 3*b - 3*c + d
610 B += 3 * D - 2 * C; // B = 3*a - 6*b + 3*c 399 B += 3 * D - 2 * C; // B = 3*a - 6*b + 3*c
611 C -= 3 * D; // C = -3*a + 3*b 400 C -= 3 * D; // C = -3*a + 3*b
612 return cubic_roots(A, B, C, D); 401 return cubic_roots(A, B, C, D);
613 } 402 }
614 403
615 function x_at_t(curve, t) { 404 function x_at_t(curve, t) {
616 var one_t = 1 - t; 405 var one_t = 1 - t;
617 if (curve.length == 4) { 406 if (curve.length == 4) {
618 return one_t * curve[0] + t * curve[2]; 407 return one_t * curve[0] + t * curve[2];
619 } 408 }
620 var one_t2 = one_t * one_t; 409 var one_t2 = one_t * one_t;
621 var t2 = t * t; 410 var t2 = t * t;
622 if (curve.length == 6) { 411 if (curve.length == 6) {
623 return one_t2 * curve[0] + 2 * one_t * t * curve[2] + t2 * curve[4]; 412 return one_t2 * curve[0] + 2 * one_t * t * curve[2] + t2 * curve[4];
624 } 413 }
414 if (curve.length == 7) {
415 var numer = one_t2 * curve[0] + 2 * one_t * t * curve[2] * curve[6]
416 + t2 * curve[4];
417 var denom = one_t2 + 2 * one_t * t * curve[6]
418 + t2;
419 return numer / denom;
420 }
625 var a = one_t2 * one_t; 421 var a = one_t2 * one_t;
626 var b = 3 * one_t2 * t; 422 var b = 3 * one_t2 * t;
627 var c = 3 * one_t * t2; 423 var c = 3 * one_t * t2;
628 var d = t2 * t; 424 var d = t2 * t;
629 return a * curve[0] + b * curve[2] + c * curve[4] + d * curve[6]; 425 return a * curve[0] + b * curve[2] + c * curve[4] + d * curve[6];
630 } 426 }
631 427
632 function y_at_t(curve, t) { 428 function y_at_t(curve, t) {
633 var one_t = 1 - t; 429 var one_t = 1 - t;
634 if (curve.length == 4) { 430 if (curve.length == 4) {
635 return one_t * curve[1] + t * curve[3]; 431 return one_t * curve[1] + t * curve[3];
636 } 432 }
637 var one_t2 = one_t * one_t; 433 var one_t2 = one_t * one_t;
638 var t2 = t * t; 434 var t2 = t * t;
639 if (curve.length == 6) { 435 if (curve.length == 6) {
640 return one_t2 * curve[1] + 2 * one_t * t * curve[3] + t2 * curve[5]; 436 return one_t2 * curve[1] + 2 * one_t * t * curve[3] + t2 * curve[5];
641 } 437 }
438 if (curve.length == 7) {
439 var numer = one_t2 * curve[1] + 2 * one_t * t * curve[3] * curve[6]
440 + t2 * curve[5];
441 var denom = one_t2 + 2 * one_t * t * curve[6]
442 + t2;
443 return numer / denom;
444 }
642 var a = one_t2 * one_t; 445 var a = one_t2 * one_t;
643 var b = 3 * one_t2 * t; 446 var b = 3 * one_t2 * t;
644 var c = 3 * one_t * t2; 447 var c = 3 * one_t * t2;
645 var d = t2 * t; 448 var d = t2 * t;
646 return a * curve[1] + b * curve[3] + c * curve[5] + d * curve[7]; 449 return a * curve[1] + b * curve[3] + c * curve[5] + d * curve[7];
647 } 450 }
648 451
649 function drawPointAtT(curve) { 452 function drawPointAtT(curve) {
650 var x = x_at_t(curve, curveT); 453 var x = x_at_t(curve, curveT);
651 var y = y_at_t(curve, curveT); 454 var y = y_at_t(curve, curveT);
(...skipping 69 matching lines...) Expand 10 before | Expand all | Expand 10 after
721 var boundsY = b - t; 524 var boundsY = b - t;
722 var boundsDist = boundsX * boundsX + boundsY * boundsY; 525 var boundsDist = boundsX * boundsX + boundsY * boundsY;
723 if (closestDist > boundsDist) { 526 if (closestDist > boundsDist) {
724 return -1; 527 return -1;
725 } 528 }
726 console.log("closestDist = " + closestDist + " boundsDist = " + boundsDi st 529 console.log("closestDist = " + closestDist + " boundsDist = " + boundsDi st
727 + " t = " + closest / 16); 530 + " t = " + closest / 16);
728 return closest / 16; 531 return closest / 16;
729 } 532 }
730 533
534 var kMaxConicToQuadPOW2 = 5;
535
536 function computeQuadPOW2(curve, tol) {
537 var a = curve[6] - 1;
538 var k = a / (4 * (2 + a));
539 var x = k * (curve[0] - 2 * curve[2] + curve[4]);
540 var y = k * (curve[1] - 2 * curve[3] + curve[5]);
541
542 var error = Math.sqrt(x * x + y * y);
543 var pow2;
544 for (pow2 = 0; pow2 < kMaxConicToQuadPOW2; ++pow2) {
545 if (error <= tol) {
546 break;
547 }
548 error *= 0.25;
549 }
550 return pow2;
551 }
552
553 function subdivide_w_value(w) {
554 return Math.sqrt(0.5 + w * 0.5);
555 }
556
557 function chop(curve, part1, part2) {
558 var w = curve[6];
559 var scale = 1 / (1 + w);
560 part1[0] = curve[0];
561 part1[1] = curve[1];
562 part1[2] = (curve[0] + curve[2] * w) * scale;
563 part1[3] = (curve[1] + curve[3] * w) * scale;
564 part1[4] = part2[0] = (curve[0] + (curve[2] * w) * 2 + curve[4]) * scale * 0.5;
565 part1[5] = part2[1] = (curve[1] + (curve[3] * w) * 2 + curve[5]) * scale * 0.5;
566 part2[2] = (curve[2] * w + curve[4]) * scale;
567 part2[3] = (curve[3] * w + curve[5]) * scale;
568 part2[4] = curve[4];
569 part2[5] = curve[5];
570 part1[6] = part2[6] = subdivide_w_value(w);
571 }
572
573 function subdivide(curve, level, pts) {
574 if (0 == level) {
575 pts.push(curve[2]);
576 pts.push(curve[3]);
577 pts.push(curve[4]);
578 pts.push(curve[5]);
579 } else {
580 var part1 = [], part2 = [];
581 chop(curve, part1, part2);
582 --level;
583 subdivide(part1, level, pts);
584 subdivide(part2, level, pts);
585 }
586 }
587
588 function chopIntoQuadsPOW2(curve, pow2, pts) {
589 subdivide(curve, pow2, pts);
590 return 1 << pow2;
591 }
592
593 function drawConic(curve, srcLeft, srcTop, scale) {
594 var tol = 1 / scale;
595 var pow2 = computeQuadPOW2(curve, tol);
596 var pts = [];
597 chopIntoQuadsPOW2(curve, pow2, pts);
598 for (var i = 0; i < pts.length; i += 4) {
599 ctx.quadraticCurveTo(
600 (pts[i + 0] - srcLeft) * scale, (pts[i + 1] - srcTop) * scale,
601 (pts[i + 2] - srcLeft) * scale, (pts[i + 3] - srcTop) * scale);
602 }
603 }
604
731 function draw(test, title) { 605 function draw(test, title) {
732 ctx.font = "normal 50px Arial"; 606 ctx.font = "normal 50px Arial";
733 ctx.textAlign = "left"; 607 ctx.textAlign = "left";
734 ctx.fillStyle = "rgba(0,0,0, 0.1)"; 608 ctx.fillStyle = "rgba(0,0,0, 0.1)";
735 ctx.fillText(title, 50, 50); 609 ctx.fillText(title, 50, 50);
736 ctx.font = "normal 10px Arial"; 610 ctx.font = "normal 10px Arial";
737 // ctx.lineWidth = "1.001"; "0.999"; 611 // ctx.lineWidth = "1.001"; "0.999";
738 var hullStarts = []; 612 var hullStarts = [];
739 var hullEnds = []; 613 var hullEnds = [];
740 var midSpokes = []; 614 var midSpokes = [];
741 var midDist = []; 615 var midDist = [];
742 var origin = []; 616 var origin = [];
743 var shortSpokes = []; 617 var shortSpokes = [];
744 var shortDist = []; 618 var shortDist = [];
745 var sweeps = []; 619 var sweeps = [];
746 drawnPts = []; 620 drawnPts = [];
747 for (var curves in test) { 621 for (var curves in test) {
748 var curve = test[curves]; 622 var curve = test[curves];
749 origin.push(curve[0]); 623 origin.push(curve[0]);
750 origin.push(curve[1]); 624 origin.push(curve[1]);
751 var startPt = []; 625 var startPt = [];
752 startPt.push(curve[2]); 626 startPt.push(curve[2]);
753 startPt.push(curve[3]); 627 startPt.push(curve[3]);
754 hullStarts.push(startPt); 628 hullStarts.push(startPt);
755 var endPt = []; 629 var endPt = [];
756 if (curve.length == 4) { 630 if (curve.length == 4) {
757 endPt.push(curve[2]); 631 endPt.push(curve[2]);
758 endPt.push(curve[3]); 632 endPt.push(curve[3]);
759 } else if (curve.length == 6) { 633 } else if (curve.length == 6 || curve.length == 7) {
760 endPt.push(curve[4]); 634 endPt.push(curve[4]);
761 endPt.push(curve[5]); 635 endPt.push(curve[5]);
762 } else if (curve.length == 8) { 636 } else if (curve.length == 8) {
763 endPt.push(curve[6]); 637 endPt.push(curve[6]);
764 endPt.push(curve[7]); 638 endPt.push(curve[7]);
765 } 639 }
766 hullEnds.push(endPt); 640 hullEnds.push(endPt);
767 var sweep = crossPt(origin, startPt, endPt); 641 var sweep = crossPt(origin, startPt, endPt);
768 sweeps.push(sweep); 642 sweeps.push(sweep);
769 var midPt = []; 643 var midPt = [];
(...skipping 11 matching lines...) Expand all
781 dx = shortPt[0] - origin[0]; 655 dx = shortPt[0] - origin[0];
782 dy = shortPt[1] - origin[1]; 656 dy = shortPt[1] - origin[1];
783 dist = Math.sqrt(dx * dx + dy * dy); 657 dist = Math.sqrt(dx * dx + dy * dy);
784 shortDist.push(dist); 658 shortDist.push(dist);
785 } 659 }
786 var intersect = []; 660 var intersect = [];
787 var useIntersect = false; 661 var useIntersect = false;
788 var maxWidth = Math.max(xmax - xmin, ymax - ymin); 662 var maxWidth = Math.max(xmax - xmin, ymax - ymin);
789 for (var curves in test) { 663 for (var curves in test) {
790 var curve = test[curves]; 664 var curve = test[curves];
791 if (curve.length == 6 || curve.length == 8) { 665 if (curve.length >= 6 && curve.length <= 8) {
792 var opp = curves == 0 || curves == 1 ? 0 : 1; 666 var opp = curves == 0 || curves == 1 ? 0 : 1;
793 var sects = ray_curve_intersect(origin, hullEnds[opp], curve); 667 var sects = ray_curve_intersect(origin, hullEnds[opp], curve);
794 intersect.push(sects); 668 intersect.push(sects);
795 if (sects.length > 1) { 669 if (sects.length > 1) {
796 var intersection = sects[0]; 670 var intersection = sects[0];
797 if (intersection == 0) { 671 if (intersection == 0) {
798 intersection = sects[1]; 672 intersection = sects[1];
799 } 673 }
800 var ix = x_at_t(curve, intersection) - origin[0]; 674 var ix = x_at_t(curve, intersection) - origin[0];
801 var iy = y_at_t(curve, intersection) - origin[1]; 675 var iy = y_at_t(curve, intersection) - origin[1];
802 var ex = hullEnds[opp][0] - origin[0]; 676 var ex = hullEnds[opp][0] - origin[0];
803 var ey = hullEnds[opp][1] - origin[1]; 677 var ey = hullEnds[opp][1] - origin[1];
804 if (ix * ex >= 0 && iy * ey >= 0) { 678 if (ix * ex >= 0 && iy * ey >= 0) {
805 var iDist = Math.sqrt(ix * ix + iy * iy); 679 var iDist = Math.sqrt(ix * ix + iy * iy);
806 var eDist = Math.sqrt(ex * ex + ey * ey); 680 var eDist = Math.sqrt(ex * ex + ey * ey);
807 var delta = Math.abs(iDist - eDist) / maxWidth; 681 var delta = Math.abs(iDist - eDist) / maxWidth;
808 if (delta > (curve.length == 6 ? 1e-5 : 1e-4)) { 682 if (delta > (curve.length != 8 ? 1e-5 : 1e-4)) {
809 useIntersect ^= true; 683 useIntersect ^= true;
810 } 684 }
811 } 685 }
812 } 686 }
813 } 687 }
814 } 688 }
815 var midLeft = curves != 0 ? crossPt(origin, midSpokes[0], midSpokes[1]) : 0; 689 var midLeft = curves != 0 ? crossPt(origin, midSpokes[0], midSpokes[1]) : 0;
816 var firstInside; 690 var firstInside;
817 if (useIntersect) { 691 if (useIntersect) {
818 var sect1 = intersect[0].length > 1; 692 var sect1 = intersect[0].length > 1;
(...skipping 21 matching lines...) Expand all
840 var shorter = midDist[1] < midDist[0]; 714 var shorter = midDist[1] < midDist[0];
841 var shortLeft = shorter ? crossPt(origin, shortSpokes[0], midSpokes[1]) 715 var shortLeft = shorter ? crossPt(origin, shortSpokes[0], midSpokes[1])
842 : crossPt(origin, midSpokes[0], shortSpokes[1]); 716 : crossPt(origin, midSpokes[0], shortSpokes[1]);
843 var startCross = crossPt(origin, hullStarts[0], hullStarts[1]); 717 var startCross = crossPt(origin, hullStarts[0], hullStarts[1]);
844 var disallowShort = midLeft == startCross && midLeft == sweeps[0] 718 var disallowShort = midLeft == startCross && midLeft == sweeps[0]
845 && midLeft == sweeps[1]; 719 && midLeft == sweeps[1];
846 720
847 // console.log("midLeft=" + midLeft + " startCross=" + startCross); 721 // console.log("midLeft=" + midLeft + " startCross=" + startCross);
848 var intersectIndex = 0; 722 var intersectIndex = 0;
849 for (var curves in test) { 723 for (var curves in test) {
850 var curve = test[curves]; 724 var curve = test[draw_id != 2 ? curves : test.length - curves - 1];
851 if (curve.length != 4 && curve.length != 6 && curve.length != 8) { 725 if (curve.length != 4 && curve.length != 6 && curve.length != 7 && c urve.length != 8) {
852 continue; 726 continue;
853 } 727 }
854 ctx.lineWidth = 1; 728 ctx.lineWidth = 1;
855 if (draw_tangents != 0) { 729 if (draw_tangents != 0) {
856 if (draw_cubic_red ? curve.length == 8 : firstInside == curves) { 730 if (draw_cubic_red ? curve.length == 8 : firstInside == curves) {
857 ctx.strokeStyle = "rgba(255,0,0, 0.3)"; 731 ctx.strokeStyle = "rgba(255,0,0, 0.3)";
858 } else { 732 } else {
859 ctx.strokeStyle = "rgba(0,0,255, 0.3)"; 733 ctx.strokeStyle = "rgba(0,0,255, 0.3)";
860 } 734 }
861 drawLine(curve[0], curve[1], curve[2], curve[3]); 735 drawLine(curve[0], curve[1], curve[2], curve[3]);
862 if (draw_tangents != 2) { 736 if (draw_tangents != 2) {
863 if (curve.length > 4) drawLine(curve[2], curve[3], curve[4], curve[5]); 737 if (curve.length > 4) drawLine(curve[2], curve[3], curve[4], curve[5]);
864 if (curve.length > 6) drawLine(curve[4], curve[5], curve[6], curve[7]); 738 if (curve.length == 8) drawLine(curve[4], curve[5], curve[6] , curve[7]);
865 } 739 }
866 if (draw_tangents != 1) { 740 if (draw_tangents != 1) {
867 if (curve.length == 6) drawLine(curve[0], curve[1], curve[4] , curve[5]); 741 if (curve.length == 6 || curve.length == 7) {
742 drawLine(curve[0], curve[1], curve[4], curve[5]);
743 }
868 if (curve.length == 8) drawLine(curve[0], curve[1], curve[6] , curve[7]); 744 if (curve.length == 8) drawLine(curve[0], curve[1], curve[6] , curve[7]);
869 } 745 }
870 } 746 }
871 ctx.beginPath(); 747 ctx.beginPath();
872 ctx.moveTo((curve[0] - srcLeft) * scale, (curve[1] - srcTop) * scale ); 748 ctx.moveTo((curve[0] - srcLeft) * scale, (curve[1] - srcTop) * scale );
873 if (curve.length == 4) { 749 if (curve.length == 4) {
874 ctx.lineTo((curve[2] - srcLeft) * scale, (curve[3] - srcTop) * s cale); 750 ctx.lineTo((curve[2] - srcLeft) * scale, (curve[3] - srcTop) * s cale);
875 } else if (curve.length == 6) { 751 } else if (curve.length == 6) {
876 ctx.quadraticCurveTo( 752 ctx.quadraticCurveTo(
877 (curve[2] - srcLeft) * scale, (curve[3] - srcTop) * scale, 753 (curve[2] - srcLeft) * scale, (curve[3] - srcTop) * scale,
878 (curve[4] - srcLeft) * scale, (curve[5] - srcTop) * scale); 754 (curve[4] - srcLeft) * scale, (curve[5] - srcTop) * scale);
755 } else if (curve.length == 7) {
756 drawConic(curve, srcLeft, srcTop, scale);
879 } else { 757 } else {
880 ctx.bezierCurveTo( 758 ctx.bezierCurveTo(
881 (curve[2] - srcLeft) * scale, (curve[3] - srcTop) * scale, 759 (curve[2] - srcLeft) * scale, (curve[3] - srcTop) * scale,
882 (curve[4] - srcLeft) * scale, (curve[5] - srcTop) * scale, 760 (curve[4] - srcLeft) * scale, (curve[5] - srcTop) * scale,
883 (curve[6] - srcLeft) * scale, (curve[7] - srcTop) * scale); 761 (curve[6] - srcLeft) * scale, (curve[7] - srcTop) * scale);
884 } 762 }
885 if (draw_cubic_red ? curve.length == 8 : firstInside == curves) { 763 if (draw_cubic_red ? curve.length == 8 : firstInside == curves) {
886 ctx.strokeStyle = "rgba(255,0,0, 1)"; 764 ctx.strokeStyle = "rgba(255,0,0, 1)";
887 } else { 765 } else {
888 ctx.strokeStyle = "rgba(0,0,255, 1)"; 766 ctx.strokeStyle = "rgba(0,0,255, 1)";
889 } 767 }
890 ctx.stroke(); 768 ctx.stroke();
891 if (draw_endpoints > 0) { 769 if (draw_endpoints > 0) {
892 drawPoint(curve[0], curve[1]); 770 drawPoint(curve[0], curve[1]);
893 if (draw_endpoints > 1 || curve.length == 4) { 771 if (draw_endpoints > 1 || curve.length == 4) {
894 drawPoint(curve[2], curve[3]); 772 drawPoint(curve[2], curve[3]);
895 } 773 }
896 if (curve.length == 6 || (draw_endpoints > 1 && curve.length == 8)) { 774 if (curve.length == 6 || curve.length == 7 ||
775 (draw_endpoints > 1 && curve.length == 8)) {
897 drawPoint(curve[4], curve[5]); 776 drawPoint(curve[4], curve[5]);
898 } 777 }
899 if (curve.length == 8) drawPoint(curve[6], curve[7]); 778 if (curve.length == 8) drawPoint(curve[6], curve[7]);
900 } 779 }
901 if (draw_midpoint != 0) { 780 if (draw_midpoint != 0) {
902 if ((curves == 0) == (midLeft == 0)) { 781 if ((curves == 0) == (midLeft == 0)) {
903 ctx.strokeStyle = "rgba(0,180,127, 0.6)"; 782 ctx.strokeStyle = "rgba(0,180,127, 0.6)";
904 } else { 783 } else {
905 ctx.strokeStyle = "rgba(127,0,127, 0.6)"; 784 ctx.strokeStyle = "rgba(127,0,127, 0.6)";
906 } 785 }
(...skipping 30 matching lines...) Expand all
937 + " shorter=" + shorter + " midT=" + midT); 816 + " shorter=" + shorter + " midT=" + midT);
938 var midX = x_at_t(curve, midT); 817 var midX = x_at_t(curve, midT);
939 var midY = y_at_t(curve, midT); 818 var midY = y_at_t(curve, midT);
940 drawPointSolid(midX, midY); 819 drawPointSolid(midX, midY);
941 if (draw_sortpoint > 1) { 820 if (draw_sortpoint > 1) {
942 drawLine(curve[0], curve[1], midX, midY); 821 drawLine(curve[0], curve[1], midX, midY);
943 } 822 }
944 } 823 }
945 if (draw_ray_intersect != 0) { 824 if (draw_ray_intersect != 0) {
946 ctx.strokeStyle = "rgba(75,45,199, 0.6)"; 825 ctx.strokeStyle = "rgba(75,45,199, 0.6)";
947 if (curve.length == 6 || curve.length == 8) { 826 if (curve.length >= 6 && curve.length <= 8) {
948 var intersections = intersect[intersectIndex]; 827 var intersections = intersect[intersectIndex];
949 for (var i in intersections) { 828 for (var i in intersections) {
950 var intersection = intersections[i]; 829 var intersection = intersections[i];
951 var x = x_at_t(curve, intersection); 830 var x = x_at_t(curve, intersection);
952 var y = y_at_t(curve, intersection); 831 var y = y_at_t(curve, intersection);
953 drawPointSolid(x, y); 832 drawPointSolid(x, y);
954 if (draw_ray_intersect > 1) { 833 if (draw_ray_intersect > 1) {
955 drawLine(curve[0], curve[1], x, y); 834 drawLine(curve[0], curve[1], x, y);
956 } 835 }
957 } 836 }
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after
991 if (!approximately_zero(scale - initScale)) { 870 if (!approximately_zero(scale - initScale)) {
992 ctx.font = "normal 20px Arial"; 871 ctx.font = "normal 20px Arial";
993 ctx.fillStyle = "rgba(0,0,0, 0.3)"; 872 ctx.fillStyle = "rgba(0,0,0, 0.3)";
994 ctx.textAlign = "right"; 873 ctx.textAlign = "right";
995 ctx.fillText(scale.toFixed(decimal_places) + 'x', 874 ctx.fillText(scale.toFixed(decimal_places) + 'x',
996 screenWidth - 10, screenHeight - 5); 875 screenWidth - 10, screenHeight - 5);
997 } 876 }
998 if (draw_t) { 877 if (draw_t) {
999 drawPointAtT(curve); 878 drawPointAtT(curve);
1000 } 879 }
1001 if (draw_id) { 880 if (draw_id != 0) {
1002 var id = -1; 881 var id = -1;
1003 for (var i = 0; i < ids.length; i += 2) { 882 for (var i = 0; i < ids.length; i += 2) {
1004 if (ids[i + 1] == curve) { 883 if (ids[i + 1] == curve) {
1005 id = ids[i]; 884 id = ids[i];
1006 break; 885 break;
1007 } 886 }
1008 } 887 }
1009 if (id >= 0) { 888 if (id >= 0) {
1010 var px = x_at_t(curve, 0.5); 889 var px = x_at_t(curve, 0.5);
1011 var py = y_at_t(curve, 0.5); 890 var py = y_at_t(curve, 0.5);
1012 var _px = (px - srcLeft) * scale; 891 var _px = (px - srcLeft) * scale;
1013 var _py = (py - srcTop) * scale; 892 var _py = (py - srcTop) * scale;
1014 ctx.beginPath(); 893 ctx.beginPath();
1015 ctx.arc(_px, _py, 15, 0, Math.PI * 2, true); 894 ctx.arc(_px, _py, 15, 0, Math.PI * 2, true);
1016 ctx.closePath(); 895 ctx.closePath();
1017 ctx.fillStyle = "white"; 896 ctx.fillStyle = "white";
1018 ctx.fill(); 897 ctx.fill();
1019 ctx.strokeStyle = "rgba(255,0,0, 1)"; 898 ctx.strokeStyle = "rgba(255,0,0, 1)";
1020 ctx.fillStyle = "rgba(255,0,0, 1)"; 899 ctx.fillStyle = "rgba(255,0,0, 1)";
1021 ctx.stroke(); 900 ctx.stroke();
1022 ctx.font = "normal 16px Arial"; 901 ctx.font = "normal 16px Arial";
1023 ctx.textAlign = "center"; 902 ctx.textAlign = "center";
1024 ctx.fillText(id, _px, _py + 5); 903 ctx.fillText(id, _px, _py + 5);
1025 } 904 }
1026 } 905 }
1027 } 906 }
1028 if (draw_t) { 907 if (draw_t) {
1029 drawCurveTControl(); 908 drawCurveTControl();
1030 } 909 }
910 if (draw_w) {
911 drawCurveWControl();
912 }
1031 } 913 }
1032 914
1033 function drawCurveTControl() { 915 function drawCurveTControl() {
1034 ctx.lineWidth = 2; 916 ctx.lineWidth = 2;
1035 ctx.strokeStyle = "rgba(0,0,0, 0.3)"; 917 ctx.strokeStyle = "rgba(0,0,0, 0.3)";
1036 ctx.beginPath(); 918 ctx.beginPath();
1037 ctx.rect(screenWidth - 80, 40, 28, screenHeight - 80); 919 ctx.rect(screenWidth - 80, 40, 28, screenHeight - 80);
1038 ctx.stroke(); 920 ctx.stroke();
1039 var ty = 40 + curveT * (screenHeight - 80); 921 var ty = 40 + curveT * (screenHeight - 80);
1040 ctx.beginPath(); 922 ctx.beginPath();
1041 ctx.moveTo(screenWidth - 80, ty); 923 ctx.moveTo(screenWidth - 80, ty);
1042 ctx.lineTo(screenWidth - 85, ty - 5); 924 ctx.lineTo(screenWidth - 85, ty - 5);
1043 ctx.lineTo(screenWidth - 85, ty + 5); 925 ctx.lineTo(screenWidth - 85, ty + 5);
1044 ctx.lineTo(screenWidth - 80, ty); 926 ctx.lineTo(screenWidth - 80, ty);
1045 ctx.fillStyle = "rgba(0,0,0, 0.6)"; 927 ctx.fillStyle = "rgba(0,0,0, 0.6)";
1046 ctx.fill(); 928 ctx.fill();
1047 var num = curveT.toFixed(decimal_places); 929 var num = curveT.toFixed(decimal_places);
1048 ctx.font = "normal 10px Arial"; 930 ctx.font = "normal 10px Arial";
1049 ctx.textAlign = "left"; 931 ctx.textAlign = "left";
1050 ctx.fillText(num, screenWidth - 78, ty); 932 ctx.fillText(num, screenWidth - 78, ty);
1051 } 933 }
1052 934
935 function drawCurveWControl() {
936 var w = -1;
937 var choice = 0;
938 for (var curves in tests[testIndex]) {
939 var curve = tests[testIndex][curves];
940 if (curve.length != 7) {
941 continue;
942 }
943 if (choice == curveW) {
944 w = curve[6];
945 break;
946 }
947 ++choice;
948 }
949 if (w < 0) {
950 return;
951 }
952 ctx.lineWidth = 2;
953 ctx.strokeStyle = "rgba(0,0,0, 0.3)";
954 ctx.beginPath();
955 ctx.rect(screenWidth - 40, 40, 28, screenHeight - 80);
956 ctx.stroke();
957 var ty = 40 + w * (screenHeight - 80);
958 ctx.beginPath();
959 ctx.moveTo(screenWidth - 40, ty);
960 ctx.lineTo(screenWidth - 45, ty - 5);
961 ctx.lineTo(screenWidth - 45, ty + 5);
962 ctx.lineTo(screenWidth - 40, ty);
963 ctx.fillStyle = "rgba(0,0,0, 0.6)";
964 ctx.fill();
965 var num = w.toFixed(decimal_places);
966 ctx.font = "normal 10px Arial";
967 ctx.textAlign = "left";
968 ctx.fillText(num, screenWidth - 38, ty);
969 }
970
1053 function ptInTControl() { 971 function ptInTControl() {
1054 var e = window.event; 972 var e = window.event;
1055 var tgt = e.target || e.srcElement; 973 var tgt = e.target || e.srcElement;
1056 var left = tgt.offsetLeft; 974 var left = tgt.offsetLeft;
1057 var top = tgt.offsetTop; 975 var top = tgt.offsetTop;
1058 var x = (e.clientX - left); 976 var x = (e.clientX - left);
1059 var y = (e.clientY - top); 977 var y = (e.clientY - top);
1060 if (x < screenWidth - 80 || x > screenWidth - 50) { 978 if (x < screenWidth - 80 || x > screenWidth - 50) {
1061 return false; 979 return false;
1062 } 980 }
1063 if (y < 40 || y > screenHeight - 80) { 981 if (y < 40 || y > screenHeight - 80) {
1064 return false; 982 return false;
1065 } 983 }
1066 curveT = (y - 40) / (screenHeight - 120); 984 curveT = (y - 40) / (screenHeight - 120);
1067 if (curveT < 0 || curveT > 1) { 985 if (curveT < 0 || curveT > 1) {
1068 throw "stop execution"; 986 throw "stop execution";
1069 } 987 }
1070 return true; 988 return true;
1071 } 989 }
1072 990
991 function ptInWControl() {
992 var e = window.event;
993 var tgt = e.target || e.srcElement;
994 var left = tgt.offsetLeft;
995 var top = tgt.offsetTop;
996 var x = (e.clientX - left);
997 var y = (e.clientY - top);
998 if (x < screenWidth - 40 || x > screenWidth - 10) {
999 return false;
1000 }
1001 if (y < 40 || y > screenHeight - 80) {
1002 return false;
1003 }
1004 var w = (y - 40) / (screenHeight - 120);
1005 if (w < 0 || w > 1) {
1006 throw "stop execution";
1007 }
1008 var choice = 0;
1009 for (var curves in tests[testIndex]) {
1010 var curve = tests[testIndex][curves];
1011 if (curve.length != 7) {
1012 continue;
1013 }
1014 if (choice == curveW) {
1015 curve[6] = w;
1016 break;
1017 }
1018 ++choice;
1019 }
1020 return true;
1021 }
1022
1073 function drawTop() { 1023 function drawTop() {
1074 init(tests[testIndex]); 1024 init(tests[testIndex]);
1075 redraw(); 1025 redraw();
1076 } 1026 }
1077 1027
1078 function redraw() { 1028 function redraw() {
1079 if (focus_on_selection > 0) { 1029 if (focus_on_selection > 0) {
1080 var focusXmin = focusYmin = Infinity; 1030 var focusXmin = focusYmin = Infinity;
1081 var focusXmax = focusYmax = -Infinity; 1031 var focusXmax = focusYmax = -Infinity;
1082 var choice = 0; 1032 var choice = 0;
1083 for (var curves in tests[testIndex]) { 1033 for (var curves in tests[testIndex]) {
1084 if (++choice != focus_on_selection) { 1034 if (++choice != focus_on_selection) {
1085 continue; 1035 continue;
1086 } 1036 }
1087 var curve = tests[testIndex][curves]; 1037 var curve = tests[testIndex][curves];
1088 var last = curve.length; 1038 var last = curve.length - (curve.length % 2 == 1 ? 1 : 0);
1089 for (var idx = 0; idx < last; idx += 2) { 1039 for (var idx = 0; idx < last; idx += 2) {
1090 focusXmin = Math.min(focusXmin, curve[idx]); 1040 focusXmin = Math.min(focusXmin, curve[idx]);
1091 focusXmax = Math.max(focusXmax, curve[idx]); 1041 focusXmax = Math.max(focusXmax, curve[idx]);
1092 focusYmin = Math.min(focusYmin, curve[idx + 1]); 1042 focusYmin = Math.min(focusYmin, curve[idx + 1]);
1093 focusYmax = Math.max(focusYmax, curve[idx + 1]); 1043 focusYmax = Math.max(focusYmax, curve[idx + 1]);
1094 } 1044 }
1095 } 1045 }
1096 focusXmin -= Math.min(1, Math.max(focusXmax - focusXmin, focusYmax - focusYmin)); 1046 focusXmin -= Math.min(1, Math.max(focusXmax - focusXmin, focusYmax - focusYmin));
1097 if (focusXmin < focusXmax && focusYmin < focusYmax) { 1047 if (focusXmin < focusXmax && focusYmin < focusYmax) {
1098 setScale(focusXmin, focusXmax, focusYmin, focusYmax); 1048 setScale(focusXmin, focusXmax, focusYmin, focusYmax);
(...skipping 149 matching lines...) Expand 10 before | Expand all | Expand 10 after
1248 redraw(); 1198 redraw();
1249 break; 1199 break;
1250 case 'u': 1200 case 'u':
1251 draw_closest_t ^= true; 1201 draw_closest_t ^= true;
1252 redraw(); 1202 redraw();
1253 break; 1203 break;
1254 case 'v': 1204 case 'v':
1255 draw_tangents = (draw_tangents + 1) % 4; 1205 draw_tangents = (draw_tangents + 1) % 4;
1256 redraw(); 1206 redraw();
1257 break; 1207 break;
1208 case 'w':
1209 ++curveW;
1210 var choice = 0;
1211 draw_w = false;
1212 for (var curves in tests[testIndex]) {
1213 var curve = tests[testIndex][curves];
1214 if (curve.length != 7) {
1215 continue;
1216 }
1217 if (choice == curveW) {
1218 draw_w = true;
1219 break;
1220 }
1221 ++choice;
1222 }
1223 if (!draw_w) {
1224 curveW = -1;
1225 }
1226 redraw();
1227 break;
1258 case 'x': 1228 case 'x':
1259 draw_point_xy ^= true; 1229 draw_point_xy ^= true;
1260 redraw(); 1230 redraw();
1261 break; 1231 break;
1262 case 'y': 1232 case 'y':
1263 draw_mouse_xy ^= true; 1233 draw_mouse_xy ^= true;
1264 redraw(); 1234 redraw();
1265 break; 1235 break;
1266 case '\\': 1236 case '\\':
1267 retina_scale ^= true; 1237 retina_scale ^= true;
1268 drawTop(); 1238 drawTop();
1269 break; 1239 break;
1270 case '`': 1240 case '`':
1271 ++focus_on_selection; 1241 ++focus_on_selection;
1272 if (focus_on_selection >= tests[testIndex].length) { 1242 if (focus_on_selection >= tests[testIndex].length) {
1273 focus_on_selection = 0; 1243 focus_on_selection = 0;
1274 } 1244 }
1275 setScale(xmin, xmax, ymin, ymax); 1245 setScale(xmin, xmax, ymin, ymax);
1276 redraw(); 1246 redraw();
1277 break; 1247 break;
1278 case '.': 1248 case '.':
1279 draw_id ^= true; 1249 draw_id = (draw_id + 1) % 3;
1280 redraw(); 1250 redraw();
1281 break; 1251 break;
1282 } 1252 }
1283 } 1253 }
1284 1254
1285 function doKeyDown(evt) { 1255 function doKeyDown(evt) {
1286 var char = evt.keyCode; 1256 var char = evt.keyCode;
1287 var preventDefault = false; 1257 var preventDefault = false;
1288 switch (char) { 1258 switch (char) {
1289 case 37: // left arrow 1259 case 37: // left arrow
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
1328 mouseX = (e.clientX - left) / scale + srcLeft; 1298 mouseX = (e.clientX - left) / scale + srcLeft;
1329 mouseY = (e.clientY - top) / scale + srcTop; 1299 mouseY = (e.clientY - top) / scale + srcTop;
1330 } 1300 }
1331 1301
1332 function calcLeftTop() { 1302 function calcLeftTop() {
1333 srcLeft = mouseX - screenWidth / 2 / scale; 1303 srcLeft = mouseX - screenWidth / 2 / scale;
1334 srcTop = mouseY - screenHeight / 2 / scale; 1304 srcTop = mouseY - screenHeight / 2 / scale;
1335 } 1305 }
1336 1306
1337 function handleMouseClick() { 1307 function handleMouseClick() {
1338 if (!draw_t || !ptInTControl()) { 1308 if ((!draw_t || !ptInTControl()) && (!draw_w || !ptInWControl())) {
1339 calcXY(); 1309 calcXY();
1340 } else { 1310 } else {
1341 redraw(); 1311 redraw();
1342 } 1312 }
1343 } 1313 }
1344 1314
1345 function initDown() { 1315 function initDown() {
1346 var test = tests[testIndex]; 1316 var test = tests[testIndex];
1347 var bestDistance = 1000000; 1317 var bestDistance = 1000000;
1348 activePt = -1; 1318 activePt = -1;
1349 for (var curves in test) { 1319 for (var curves in test) {
1350 var testCurve = test[curves]; 1320 var testCurve = test[curves];
1351 if (testCurve.length != 4 && testCurve.length != 6 && testCurve.leng th != 8) { 1321 if (testCurve.length != 4 && (testCurve.length < 6 || testCurve.leng th > 8)) {
1352 continue; 1322 continue;
1353 } 1323 }
1354 for (var i = 0; i < testCurve.length; i += 2) { 1324 var testMax = testCurve.length == 7 ? 6 : testCurve.length;
1325 for (var i = 0; i < testMax; i += 2) {
1355 var testX = testCurve[i]; 1326 var testX = testCurve[i];
1356 var testY = testCurve[i + 1]; 1327 var testY = testCurve[i + 1];
1357 var dx = testX - mouseX; 1328 var dx = testX - mouseX;
1358 var dy = testY - mouseY; 1329 var dy = testY - mouseY;
1359 var dist = dx * dx + dy * dy; 1330 var dist = dx * dx + dy * dy;
1360 if (dist > bestDistance) { 1331 if (dist > bestDistance) {
1361 continue; 1332 continue;
1362 } 1333 }
1363 activeCurve = testCurve; 1334 activeCurve = testCurve;
1364 activePt = i; 1335 activePt = i;
(...skipping 65 matching lines...) Expand 10 before | Expand all | Expand 10 after
1430 <body onLoad="start();"> 1401 <body onLoad="start();">
1431 1402
1432 <canvas id="canvas" width="750" height="500" 1403 <canvas id="canvas" width="750" height="500"
1433 onmousedown="mouseDown = true" 1404 onmousedown="mouseDown = true"
1434 onmouseup="mouseDown = false" 1405 onmouseup="mouseDown = false"
1435 onmousemove="handleMouseOver()" 1406 onmousemove="handleMouseOver()"
1436 onclick="handleMouseClick()" 1407 onclick="handleMouseClick()"
1437 ></canvas > 1408 ></canvas >
1438 </body> 1409 </body>
1439 </html> 1410 </html>
OLDNEW
« no previous file with comments | « tests/PathOpsTestCommon.cpp ('k') | tools/pathops_visualizer.htm » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698