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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: experimental/Intersection/cd.htm

Issue 867213004: remove prototype pathops code (Closed) Base URL: https://skia.googlesource.com/skia.git@master
Patch Set: Created 5 years, 10 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 | « experimental/Intersection/bc.htm ('k') | experimental/Intersection/edge_Prefix.pch » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <html>
2 <head>
3 <div style="height:0">
4
5 <div id="test1">
6 computeDelta c1=(0,1 1,6 1,0 2,0) t1=0.0166500365 scale1=1 c2=(0,1 0,2 1,0 6,1) t2=0.126935168 scale2=1
7 cubicTangent t=0.0166500365 tangent=(-2.85263545,-12.6745554 2.95089079,15.15591 66) pt=(0.0491276698 1.24068063) dxy=(2.90176312 13.915236)
8 cubicTangent t=0.126935168 tangent=(-0.852150487,0.242871519 0.961097194,2.25325 68) pt=(0.0544733534 1.24806416) dxy=(0.90662384 1.00519264)
9 cubicDelta tangent=(-0.00039510851,-0.00189471984 0.0495227783,1.24257535) inter sectLen=0.00193547772 tangentLen=14.2145708 scale=0.00390625 result=0.0040424115 3
10 cubicDelta tangent=(0.00495057512,0.00548880522 0.0495227783,1.24257535) interse ctLen=0.00739156118 tangentLen=1.35365395 scale=0.00390625 result=0.00936670107
11 </div>
12
13 <div id="test2">
14 computeDelta c1=(0,1 0,2 1,0 6,1) t1=0.121215914 scale1=0.0187334021 c2=(0,1 1,6 1,0 2,0) t2=0.0167515231 scale2=0.00808482306
15 cubicTangent t=0.121215914 tangent=(-0.810112087,0.159501524 0.908958243,2.32468 734) pt=(0.0494230781 1.24209443) dxy=(0.859535165 1.08259291)
16 cubicTangent t=0.0167515231 tangent=(-2.85175241,-12.6666182 2.95059667,15.15080 33) pt=(0.0494221303 1.24209251) dxy=(2.90117454 13.9087108)
17 cubicDelta tangent=(7.4284882e-07,9.35625319e-07 0.0494223352,1.2420935) interse ctLen=1.19466276e-06 tangentLen=1.38231983 scale=7.31773521e-05 result=7.4041596 9e-05
18 cubicDelta tangent=(-2.04951629e-07,-9.82572016e-07 0.0494223352,1.2420935) inte rsectLen=1.00371955e-06 tangentLen=14.2080628 scale=3.15813401e-05 result=3.1651 9844e-05
19 </div>
20
21 <div id="test3">
22 computeDelta c1=(0,1 1,6 1,0 2,0) t1=0.0167458976 scale1=6.33039689e-05 c2=(0,1 0,2 1,0 6,1) t2=0.121141872 scale2=0.000148083194
23 cubicTangent t=0.0167458976 tangent=(-2.85180136,-12.6670582 2.95061297,15.15108 67) pt=(0.0494058095 1.24201427) dxy=(2.90120716 13.9090724)
24 cubicTangent t=0.121141872 tangent=(-0.809569955,0.158411583 0.908288874,2.32561 689) pt=(0.0493594591 1.24201424) dxy=(0.858929414 1.08360265)
25 cubicDelta tangent=(-1.65436799e-05,-7.93143093e-05 0.0494223532,1.24209358) int ersectLen=8.1021312e-05 tangentLen=14.2084235 scale=2.47281129e-07 result=5.9496 2466e-06
26 cubicDelta tangent=(-6.28940702e-05,-7.93454971e-05 0.0494223532,1.24209358) int ersectLen=0.000101249059 tangentLen=1.38273441 scale=5.78449976e-07 result=7.380 22436e-05
27 </div>
28
29 </div>
30
31 <script type="text/javascript">
32
33 var testDivs = [
34 test3,
35 test2,
36 test1,
37 ];
38
39 var scale, columns, rows, xStart, yStart;
40
41 var ticks = 10;
42 var at_x = 13 + 0.5;
43 var at_y = 23 + 0.5;
44 var decimal_places = 3;
45 var tests = [];
46 var testTitles = [];
47 var testIndex = 0;
48 var ctx;
49 var minScale = 1;
50 var subscale = 1;
51 var curveT = -1;
52 var drawCubics = true;
53 var drawQuads = true;
54 var drawControlLines = true;
55 var drawT = true;
56
57 var xmin, xmax, ymin, ymax;
58
59 function strs_to_nums(strs) {
60 var result = [];
61 for (var idx in strs) {
62 var str = strs[idx];
63 var num = parseFloat(str);
64 if (isNaN(num)) {
65 result.push(str);
66 } else {
67 result.push(num);
68 }
69 }
70 return result;
71 }
72
73 function construct_regexp(pattern) {
74 var escape = pattern.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
75 escape = escape.replace(/PT_VAL/g, "(-?\\d+\\.?\\d*e?-?\\d*),(-?\\d+\\.?\\d* e?-?\\d*)");
76 escape = escape.replace(/T_VAL/g, "(-?\\d+\\.?\\d*e?-?\\d*)");
77 escape = escape.replace(/IDX/g, "(\\d+)");
78 escape = escape.replace(/OPT/g, "(\\?|-?\\d+)");
79 return new RegExp(escape, 'i');
80 }
81
82 var COMPUTE_DELTA = 1;
83 var CUBIC_TANGENT = 2;
84 var CUBIC_DATA = 3;
85
86 var DELTA_C1_X1 = 1;
87 var DELTA_C1_Y1 = 2;
88 var DELTA_C1_X2 = 3;
89 var DELTA_C1_Y2 = 4;
90 var DELTA_C1_X3 = 5;
91 var DELTA_C1_Y3 = 6;
92 var DELTA_C1_X4 = 7;
93 var DELTA_C1_Y4 = 8;
94 var DELTA_T1 = 9;
95 var DELTA_SCALE1 = 10;
96 var DELTA_C2_X1 = 11;
97 var DELTA_C2_Y1 = 12;
98 var DELTA_C2_X2 = 13;
99 var DELTA_C2_Y2 = 14;
100 var DELTA_C2_X3 = 15;
101 var DELTA_C2_Y3 = 16;
102 var DELTA_C2_X4 = 17;
103 var DELTA_C2_Y4 = 18;
104 var DELTA_T2 = 19;
105 var DELTA_SCALE2 = 20;
106
107 var TANGENT_T = 1;
108 var TANGENT_TANGENT_X1 = 2;
109 var TANGENT_TANGENT_Y1 = 3;
110 var TANGENT_TANGENT_X2 = 4;
111 var TANGENT_TANGENT_Y2 = 5;
112 var TANGENT_PT_X = 6;
113 var TANGENT_PT_Y = 7;
114 var TANGENT_DXY_X = 8;
115 var TANGENT_DXY_Y = 9;
116
117 var CUBIC_TANGENT_X1 = 1;
118 var CUBIC_TANGENT_Y1 = 2;
119 var CUBIC_TANGENT_X2 = 3;
120 var CUBIC_TANGENT_Y2 = 4;
121 var CUBIC_INTERSECTION_LEN = 5;
122 var CUBIC_TANGENT_LEN = 6;
123 var CUBIC_SCALE = 7;
124 var CUBIC_RESULT = 8;
125
126 function parse(test, title) {
127 var compute_delta = construct_regexp(" c1=(PT_VAL PT_VAL PT_VAL PT_VAL)"
128 + " t1=T_VAL scale1=T_VAL c2=(PT_VAL PT_VAL PT_VAL PT_VAL) t2=T_VAL scal e2=T_VAL");
129 var cubic_tangent = construct_regexp(" t=T_VAL tangent=(PT_VAL PT_VAL)"
130 + " pt=(T_VAL T_VAL) dxy=(T_VAL T_VAL)");
131 var cubic_data = construct_regexp(" tangent=(PT_VAL PT_VAL)"
132 + " intersectLen=T_VAL tangentLen=T_VAL scale=T_VAL result=T_VAL");
133
134 var cStrs = test.split("computeDelta");
135 var data = [];
136 for (var cs in cStrs) {
137 var str = cStrs[cs];
138 if (str == "\n") {
139 continue;
140 }
141 var tStrs = str.split("cubicTangent");
142 for (var ts in tStrs) {
143 str = tStrs[ts];
144 if (str == "\n") {
145 continue;
146 }
147 var dStrs = str.split("cubicDelta");
148 var dataStrs;
149 for (var ds in dStrs) {
150 str = dStrs[ds];
151 if (str == "\n") {
152 continue;
153 }
154 var lineMatch, lineStrs;
155 if (compute_delta.test(str)) {
156 lineMatch = COMPUTE_DELTA;
157 lineStrs = compute_delta.exec(str);
158 } else if (cubic_tangent.test(str)) {
159 lineMatch = CUBIC_TANGENT;
160 lineStrs = cubic_tangent.exec(str);
161 } else if (cubic_data.test(str)) {
162 lineMatch = CUBIC_DATA;
163 lineStrs = cubic_data.exec(str);
164 } else {
165 continue;
166 }
167 var line = strs_to_nums(lineStrs);
168 data.push(lineMatch);
169 data.push(line);
170 }
171 }
172 }
173 if (data.length >= 1) {
174 tests.push(data);
175 testTitles.push(title);
176 }
177 }
178
179 function init(test) {
180 var canvas = document.getElementById('canvas');
181 if (!canvas.getContext) return;
182 canvas.width = window.innerWidth - at_x;
183 canvas.height = window.innerHeight - at_y;
184 ctx = canvas.getContext('2d');
185 xmin = Infinity;
186 xmax = -Infinity;
187 ymin = Infinity;
188 ymax = -Infinity;
189 var scanType = -1;
190 for (var scansStr in test) {
191 var scans = parseInt(scansStr);
192 var scan = test[scans];
193 if (scanType == -1) {
194 scanType = scan;
195 continue;
196 }
197 if (scanType == CUBIC_TANGENT) {
198 for (var idx = TANGENT_TANGENT_X1; idx < TANGENT_PT_X; idx += 2) {
199 xmin = Math.min(xmin, scan[idx]);
200 xmax = Math.max(xmax, scan[idx]);
201 ymin = Math.min(ymin, scan[idx + 1]);
202 ymax = Math.max(ymax, scan[idx + 1]);
203 }
204 }
205 scanType = -1;
206 }
207 var testW = xmax - xmin;
208 var testH = ymax - ymin;
209 subscale = 1;
210 if (testW > 1e10 || testH > 1e10) {
211 return;
212 }
213 while (testW * subscale < 0.1 && testH * subscale < 0.1) {
214 subscale *= 10;
215 }
216 while (testW * subscale > 10 && testH * subscale > 10) {
217 subscale /= 10;
218 }
219 calcFromScale();
220 }
221
222 function calcFromScale() {
223 xStart = Math.floor(xmin * subscale) / subscale;
224 yStart = Math.floor(ymin * subscale) / subscale;
225 var xEnd = Math.ceil(xmin * subscale) / subscale;
226 var yEnd = Math.ceil(ymin * subscale) / subscale;
227 var cCelsW = Math.floor(ctx.canvas.width / 10);
228 var cCelsH = Math.floor(ctx.canvas.height / 10);
229 var testW = xEnd - xStart;
230 var testH = yEnd - yStart;
231 var scaleWH = 1;
232 while (cCelsW > testW * scaleWH * 10 && cCelsH > testH * scaleWH * 10) {
233 scaleWH *= 10;
234 }
235 while (cCelsW * 10 < testW * scaleWH && cCelsH * 10 < testH * scaleWH) {
236 scaleWH /= 10;
237 }
238
239 columns = Math.ceil(xmax * subscale) - Math.floor(xmin * subscale) + 1;
240 rows = Math.ceil(ymax * subscale) - Math.floor(ymin * subscale) + 1;
241
242 var hscale = ctx.canvas.width / columns / ticks;
243 var vscale = ctx.canvas.height / rows / ticks;
244 minScale = Math.floor(Math.min(hscale, vscale));
245 scale = minScale * subscale;
246 }
247
248 function drawPoint(px, py, xoffset, yoffset, unit) {
249 var label = px.toFixed(decimal_places) + ", " + py.toFixed(decimal_places);
250 var _px = px * unit + xoffset;
251 var _py = py * unit + yoffset;
252 ctx.beginPath();
253 ctx.arc(_px, _py, 3, 0, Math.PI*2, true);
254 ctx.closePath();
255 ctx.fill();
256 ctx.fillText(label, _px + 5, _py);
257 }
258
259 function drawTPt(scan, cIdx, tIdx, xoffset, yoffset, unit) {
260 var t = scan[tIdx];
261 var one_t = 1 - t;
262 var one_t2 = one_t * one_t;
263 var a = one_t2 * one_t;
264 var b = 3 * one_t2 * t;
265 var t2 = t * t;
266 var c = 3 * one_t * t2;
267 var d = t2 * t;
268 var x = a * scan[cIdx + 0] + b * scan[cIdx + 2] + c * scan[cIdx + 4] + d * s can[cIdx + 6];
269 var y = a * scan[cIdx + 1] + b * scan[cIdx + 3] + c * scan[cIdx + 5] + d * s can[cIdx + 7];
270 drawPoint(x, y, xoffset, yoffset, unit);
271 }
272
273 function draw(test, title, scale) {
274 ctx.fillStyle = "rgba(0,0,0, 0.1)";
275 ctx.font = "normal 50px Arial";
276 ctx.fillText(title, 50, 50);
277 ctx.font = "normal 10px Arial";
278
279 var unit = scale * ticks;
280 ctx.lineWidth = 1;
281 var i;
282 for (i = 0; i <= rows * ticks; ++i) {
283 ctx.strokeStyle = (i % ticks) != 0 ? "rgb(200,200,200)" : "black";
284 ctx.beginPath();
285 ctx.moveTo(at_x + 0, at_y + i * minScale);
286 ctx.lineTo(at_x + ticks * columns * minScale, at_y + i * minScale);
287 ctx.stroke();
288 }
289 for (i = 0; i <= columns * ticks; ++i) {
290 ctx.strokeStyle = (i % ticks) != 0 ? "rgb(200,200,200)" : "black";
291 ctx.beginPath();
292 ctx.moveTo(at_x + i * minScale, at_y + 0);
293 ctx.lineTo(at_x + i * minScale, at_y + ticks * rows * minScale);
294 ctx.stroke();
295 }
296
297 var xoffset = xStart * -unit + at_x;
298 var yoffset = yStart * -unit + at_y;
299
300 ctx.fillStyle = "rgb(40,80,60)"
301 for (i = 0; i <= columns; i += 1)
302 {
303 num = xStart + i / subscale;
304 ctx.fillText(num.toFixed(decimal_places), xoffset + num * unit - 5, 10);
305 }
306 for (i = 0; i <= rows; i += 1)
307 {
308 num = yStart + i / subscale;
309 ctx.fillText(num.toFixed(decimal_places), 0, yoffset + num * unit + 0);
310 }
311 var scanType = -1;
312 var partIndex = 0;
313 for (var scans in test) {
314 var scan = test[scans];
315 if (scanType == -1) {
316 scanType = scan;
317 continue;
318 }
319 partIndex++;
320 if (scanType == COMPUTE_DELTA) {
321 ctx.beginPath();
322 ctx.moveTo(xoffset + scan[DELTA_C1_X1] * unit, yoffset + scan[DELTA_ C1_Y1] * unit);
323 ctx.bezierCurveTo(
324 xoffset + scan[DELTA_C1_X2] * unit, yoffset + scan[DELTA_C1_Y2] * unit,
325 xoffset + scan[DELTA_C1_X3] * unit, yoffset + scan[DELTA_C1_Y3] * unit,
326 xoffset + scan[DELTA_C1_X4] * unit, yoffset + scan[DELTA_C1_Y4] * unit);
327 ctx.strokeStyle = "red"; // "rgba(0,0,0, 1.0)";
328 ctx.stroke();
329 ctx.beginPath();
330 ctx.moveTo(xoffset + scan[DELTA_C2_X1] * unit, yoffset + scan[DELTA_ C2_Y1] * unit);
331 ctx.bezierCurveTo(
332 xoffset + scan[DELTA_C2_X2] * unit, yoffset + scan[DELTA_C2_Y2] * unit,
333 xoffset + scan[DELTA_C2_X3] * unit, yoffset + scan[DELTA_C2_Y3] * unit,
334 xoffset + scan[DELTA_C2_X4] * unit, yoffset + scan[DELTA_C2_Y4] * unit);
335 ctx.strokeStyle = "blue"; // "rgba(0,0,0, 1.0)";
336 ctx.stroke();
337 }
338 if (scanType == COMPUTE_DELTA && drawControlLines) {
339 ctx.beginPath();
340 ctx.moveTo(xoffset + scan[DELTA_C1_X1] * unit, yoffset + scan[DELTA_ C1_Y1] * unit);
341 ctx.lineTo(xoffset + scan[DELTA_C1_X2] * unit, yoffset + scan[DELTA_ C1_Y2] * unit);
342 ctx.lineTo(xoffset + scan[DELTA_C1_X3] * unit, yoffset + scan[DELTA_ C1_Y3] * unit);
343 ctx.lineTo(xoffset + scan[DELTA_C1_X4] * unit, yoffset + scan[DELTA_ C1_Y4] * unit);
344 ctx.strokeStyle = "rgba(0,0,0, 0.3)";
345 ctx.stroke();
346 ctx.beginPath();
347 ctx.moveTo(xoffset + scan[DELTA_C2_X1] * unit, yoffset + scan[DELTA_ C2_Y1] * unit);
348 ctx.lineTo(xoffset + scan[DELTA_C2_X2] * unit, yoffset + scan[DELTA_ C2_Y2] * unit);
349 ctx.lineTo(xoffset + scan[DELTA_C2_X3] * unit, yoffset + scan[DELTA_ C2_Y3] * unit);
350 ctx.lineTo(xoffset + scan[DELTA_C2_X4] * unit, yoffset + scan[DELTA_ C2_Y4] * unit);
351 ctx.strokeStyle = "rgba(0,0,0, 0.3)";
352 ctx.stroke();
353 }
354 if (scanType == COMPUTE_DELTA && drawT) {
355 drawTPt(scan, DELTA_C1_X1, DELTA_T1, xoffset, yoffset, unit);
356 drawTPt(scan, DELTA_C2_X1, DELTA_T2, xoffset, yoffset, unit);
357 var num = "c1=" + scan[DELTA_T1].toFixed(decimal_places)
358 + " c2=" + scan[DELTA_T2].toFixed(decimal_places);
359 ctx.beginPath();
360 ctx.rect(200,10,200,10);
361 ctx.fillStyle="white";
362 ctx.fill();
363 ctx.fillStyle="black";
364 ctx.fillText(num, 230, 18);
365 }
366 if (scanType == CUBIC_TANGENT) {
367 ctx.beginPath();
368 ctx.moveTo(xoffset + scan[TANGENT_TANGENT_X1] * unit, yoffset + scan [TANGENT_TANGENT_Y1] * unit);
369 ctx.lineTo(xoffset + scan[TANGENT_TANGENT_X2] * unit, yoffset + scan [TANGENT_TANGENT_Y2] * unit);
370 ctx.strokeStyle = partIndex > 2 ? "rgba(0,0,255, 0.7)" : "rgba(255,0 ,0, 0.7)";
371 ctx.stroke();
372 }
373 scanType = -1;
374 }
375 }
376
377 function drawTop() {
378 init(tests[testIndex]);
379 redraw();
380 }
381
382 function redraw() {
383 ctx.beginPath();
384 ctx.rect(0, 0, ctx.canvas.width, ctx.canvas.height);
385 ctx.fillStyle="white";
386 ctx.fill();
387 draw(tests[testIndex], testTitles[testIndex], scale);
388 }
389
390 function doKeyPress(evt) {
391 var char = String.fromCharCode(evt.charCode);
392 switch (char) {
393 case 'c':
394 drawCubics ^= true;
395 redraw();
396 break;
397 case 'd':
398 decimal_places++;
399 redraw();
400 break;
401 case 'D':
402 decimal_places--;
403 if (decimal_places < 1) {
404 decimal_places = 1;
405 }
406 redraw();
407 break;
408 case 'l':
409 drawControlLines ^= true;
410 redraw();
411 break;
412 case 'N':
413 testIndex += 9;
414 case 'n':
415 if (++testIndex >= tests.length)
416 testIndex = 0;
417 mouseX = Infinity;
418 drawTop();
419 break;
420 case 'P':
421 testIndex -= 9;
422 case 'p':
423 if (--testIndex < 0)
424 testIndex = tests.length - 1;
425 mouseX = Infinity;
426 drawTop();
427 break;
428 case 'q':
429 drawQuads ^= true;
430 redraw();
431 break;
432 case 't':
433 drawT ^= true;
434 redraw();
435 break;
436 case 'x':
437 drawCubics ^= true;
438 drawQuads ^= true;
439 redraw();
440 break;
441 case '-':
442 case '_':
443 subscale /= 2;
444 calcFromScale();
445 redraw();
446 break;
447 case '+':
448 case '=':
449 subscale *= 2;
450 calcFromScale();
451 redraw();
452 break;
453 }
454 }
455
456 /*
457 var e = window.event;
458 var tgt = e.target || e.srcElement;
459 var min = tgt.offsetTop + Math.ceil(at_y);
460 var max = min + ticks * rows * minScale;
461 curveT = (e.clientY - min) / (max - min);
462 redraw();
463 }
464 */
465
466 function calcXY() {
467 var e = window.event;
468 var tgt = e.target || e.srcElement;
469 var left = tgt.offsetLeft;
470 var top = tgt.offsetTop;
471 var unit = scale * ticks;
472 mouseX = (e.clientX - left - Math.ceil(at_x) + 1) / unit + xStart;
473 mouseY = (e.clientY - top - Math.ceil(at_y)) / unit + yStart;
474 }
475
476 function handleMouseOver() {
477 /* calcXY();
478 var num = mouseX.toFixed(decimal_places) + ", " + mouseY.toFixed(decimal_pla ces);
479 ctx.beginPath();
480 ctx.rect(30,10,200,10);
481 ctx.fillStyle="white";
482 ctx.fill();
483 ctx.fillStyle="black";
484 ctx.fillText(num, 30, 18);
485 */
486 }
487
488 function start() {
489 for (i = 0; i < testDivs.length; ++i) {
490 var title = testDivs[i].id.toString();
491 var str = testDivs[i].firstChild.data;
492 parse(str, title);
493 }
494 drawTop();
495 window.addEventListener('keypress', doKeyPress, true);
496 window.onresize = function() {
497 drawTop();
498 }
499 }
500
501 function handleMouseClick() {
502 start();
503 }
504
505 function startx() {
506 }
507
508 </script>
509 </head>
510
511 <body onLoad="startx();">
512 <canvas id="canvas" width="750" height="500"
513 onmousemove="handleMouseOver()"
514 onclick="handleMouseClick()"
515 ></canvas >
516 </body>
517 </html>
OLDNEW
« no previous file with comments | « experimental/Intersection/bc.htm ('k') | experimental/Intersection/edge_Prefix.pch » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698