SVG / Canvas :: shape-rendering =“crispEdges”通过JavaScript？ [英] SVG / Canvas :: shape-rendering="crispEdges" via JavaScript?

问题描述

我想关闭抗锯齿功能，我相信我需要将形状呈现设置为crispEdges。

如何使用 JavaScript 来实现这个功能？

我需要关闭抗锯齿：

  context.strokeStyle = gradient; 
 context.lineWidth = 1; 
 context.moveTo（x + size，y + size）; 
 context.lineTo（x + dx，y + dy）; 
 context.stroke（）; 
  

这样，线条应该看起来像右边的，而不是左边的。

>

$

在SVG中，您可以设置'shape-rendering'属性例如像这样：

  someElement.style.shapeRendering =crispEdges; 
  

或作为属性：

  someElement.setAttribute（shape-rendering，crispEdges）; 
  

HTML5 canvas没有办法切换反锯齿开/关，一些原因为什么由Ian Hickson在此主题中。 p>

I want to turn off anti-aliasing and I believe I need to set shape-rendering to "crispEdges" for that.

How can I do that with JavaScript ?

This a a part of my code where I need turn off anti-aliasing:

context.strokeStyle = gradient;
context.lineWidth = 1;
context.moveTo(x + size, y + size);
context.lineTo(x + dx, y + dy);
context.stroke();

So lines should look like the one on right, and not other one on left.

Every help would be greatly appreciated!

解决方案

In SVG you can set the 'shape-rendering' property e.g like this:

someElement.style.shapeRendering = "crispEdges";

Or as an attribute:

someElement.setAttribute("shape-rendering", "crispEdges");

HTML5 canvas has no way for toggling anti-aliasing on/off, some reasons why are given by Ian Hickson in this thread.

这篇关于SVG / Canvas :: shape-rendering =“crispEdges”通过JavaScript？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！