继续操作前请注册或者登录。
胡斌

add method use line to compare with use arc

正在显示 1 个修改的文件 包含 62 行增加18 行删除
@@ -371,25 +371,58 @@ @@ -371,25 +371,58 @@
371 drawMouse(); 371 drawMouse();
372 } 372 }
373 373
  374 + var draw_method = 0;
374 375
375 - /* 376 + function draw_method_change(){
  377 + draw_method = document.getElementById("draw_method").selectedIndex;
  378 + }
  379 +
  380 + function draw_ext_input(px,py,p) {
  381 + if(draw_method == 0) {
  382 + draw_ext_input_arc(px,py,p);
  383 + }
  384 + else if(draw_method == 1) {
  385 + draw_ext_input_line(px,py,p);
  386 + }
  387 + }
  388 +
376 var last_ext_press = 0; 389 var last_ext_press = 0;
377 - function draw_ext_input(px,py,press) { 390 + var last_x = 0;
  391 + var last_y = 0;
  392 + function draw_ext_input_line(px,py,p) {
378 x = px * ratio_x; 393 x = px * ratio_x;
379 y = py * ratio_y; 394 y = py * ratio_y;
380 - if(last_ext_press == 0 && press != 0){ 395 + if(last_ext_press == 0){
  396 + if (p != 0) {
  397 + ctx.beginPath();
  398 + ctx.lineWidth = (kWIDTH_MAX - kWIDTH_MIN) / pressure_level * p + kWIDTH_MIN;
  399 + ctx.moveTo(x, y);
  400 + ctx.lineTo(x, y);
  401 + ctx.stroke();
  402 + last_x = x;
  403 + last_y = y;
  404 + }
  405 + }
  406 + else if(p != 0) {
381 ctx.beginPath(); 407 ctx.beginPath();
382 -  
383 - ctx.moveTo(x, y);  
384 - last_ext_press = 1; 408 + ctx.lineWidth = (kWIDTH_MAX - kWIDTH_MIN)/pressure_level * p + kWIDTH_MIN;
  409 + ctx.moveTo(last_x, last_y);
  410 + ctx.lineTo(x, y);
  411 + ctx.stroke();
  412 + last_x = x;
  413 + last_y = y;
385 } 414 }
386 - else if(press != 0) {  
387 - var line_width = (kWIDTH_MAX - kWIDTH_MIN)/pressure_level * p + kWIDTH_MIN; 415 + else {
  416 + ctx.beginPath();
  417 + ctx.lineWidth = (kWIDTH_MAX - kWIDTH_MIN)/pressure_level * last_ext_press + kWIDTH_MIN;
  418 + ctx.moveTo(last_x, last_y);
388 ctx.lineTo(x, y); 419 ctx.lineTo(x, y);
389 ctx.stroke(); 420 ctx.stroke();
390 } 421 }
391 - last_ext_press = press;  
392 - }*/ 422 +
  423 + last_ext_press = p;
  424 + }
  425 +
393 function Point(x , y, p) { 426 function Point(x , y, p) {
394 this.x = x; 427 this.x = x;
395 this.y = y; 428 this.y = y;
@@ -406,13 +439,17 @@ @@ -406,13 +439,17 @@
406 var rotate_degree = 0; 439 var rotate_degree = 0;
407 var pressure_level = 2048.0 - 1; 440 var pressure_level = 2048.0 - 1;
408 441
409 - function draw_ext_input(px, py, press) { 442 + function draw_ext_input_arc(px, py, press) {
410 if(press == 0) { 443 if(press == 0) {
411 previousPoint.p = 0; 444 previousPoint.p = 0;
412 } 445 }
413 else { 446 else {
414 - currentPoint.x = Math.round( px * ratio_x);  
415 - currentPoint.y = Math.round( py * ratio_y); 447 + //currentPoint.x = Math.round( px * ratio_x);
  448 + //currentPoint.y = Math.round( py * ratio_y);
  449 +
  450 + currentPoint.x = px * ratio_x;
  451 + currentPoint.y = py * ratio_y;
  452 +
416 currentPoint.p = press; 453 currentPoint.p = press;
417 454
418 if(previousPoint.p == 0) { 455 if(previousPoint.p == 0) {
@@ -455,7 +492,8 @@ @@ -455,7 +492,8 @@
455 function draw_point(pt){ 492 function draw_point(pt){
456 var line_width = (kWIDTH_MAX - kWIDTH_MIN)/pressure_level * pt.p + kWIDTH_MIN; 493 var line_width = (kWIDTH_MAX - kWIDTH_MIN)/pressure_level * pt.p + kWIDTH_MIN;
457 ctx.beginPath(); //Start path 494 ctx.beginPath(); //Start path
458 - ctx.arc(pt.x, pt.y, line_width, 0, Math.PI * 2, true); // Draw a point using the arc function of the canvas with a point structure. 495 + ctx.lineWidth = 0.1;
  496 + ctx.arc(pt.x, pt.y, line_width/2, 0, Math.PI * 2, true); // Draw a point using the arc function of the canvas with a point structure.
459 ctx.fill(); 497 ctx.fill();
460 previousWidth = line_width; 498 previousWidth = line_width;
461 } 499 }
@@ -506,16 +544,21 @@ @@ -506,16 +544,21 @@
506 544
507 while (times > 0) { 545 while (times > 0) {
508 times = times - 1; 546 times = times - 1;
509 -  
510 - ctx.lineWidth = w;  
511 ctx.beginPath(); //Start path 547 ctx.beginPath(); //Start path
512 - ctx.arc(x, y, w, 0, Math.PI * 2, true); // Draw a point using the arc function of the canvas with a point structure. 548 + if(w < kWIDTH_MIN) {
  549 + w = kWIDTH_MIN;
  550 + }
  551 + ctx.arc(x, y, w /2, 0, Math.PI * 2, true); // Draw a point using the arc function of the canvas with a point structure.
513 ctx.fill(); 552 ctx.fill();
514 x += stepx; 553 x += stepx;
515 y += stepy; 554 y += stepy;
516 w += stepw; 555 w += stepw;
517 } 556 }
518 557
  558 + ctx.beginPath(); //Start path
  559 + ctx.arc(pt.x, pt.y, w1 /2, 0, Math.PI * 2, true); // Draw a point using the arc function of the canvas with a point structure.
  560 + ctx.fill();
  561 +
519 previousWidth = w1; 562 previousWidth = w1;
520 } 563 }
521 564
@@ -2016,7 +2059,7 @@ @@ -2016,7 +2059,7 @@
2016 </div> 2059 </div>
2017 2060
2018 2061
2019 - <table width = "500" align="top"> 2062 + <table width = "600" align="top">
2020 <tr> 2063 <tr>
2021 <td><label for="line_width" style="color:#a3bd97;">line width:</label></td> 2064 <td><label for="line_width" style="color:#a3bd97;">line width:</label></td>
2022 <td> 2065 <td>
@@ -2030,6 +2073,7 @@ @@ -2030,6 +2073,7 @@
2030 <td><input type="text" id="line_width" size="10" readonly style="border:0; color:#f6931f; font-weight:bold;"/></td>> 2073 <td><input type="text" id="line_width" size="10" readonly style="border:0; color:#f6931f; font-weight:bold;"/></td>>
2031 2074
2032 <td colspan="2"><select id="pen_type" name="pen_type"><option value ="PendoTech">PendoTech PH-1820-A</option><option value ="robot">Nebula T7</option></select></td> 2075 <td colspan="2"><select id="pen_type" name="pen_type"><option value ="PendoTech">PendoTech PH-1820-A</option><option value ="robot">Nebula T7</option></select></td>
  2076 + <td colspan="2"><select id="draw_method" name="draw_method" onchange='javascript:draw_method_change();'><option value ="use_arc">use arc</option><option value ="use_line">use line</option></select></td>
2033 </tr> 2077 </tr>
2034 </table> 2078 </table>
2035 </div> 2079 </div>