English 中文(简体)
页: 1
原标题:HTML5 canvas linear gradient doesn t work for me
  • 时间:2012-04-25 16:02:01
  •  标签:
  • html
  • canvas

在试图使用Linear Gradient时,我有问题。

//linear gradient
canvas.beginPath();
canvas.arc(350,400,100,0,2*Math.PI,false);
canvas.strokeStyle =  lightblue ;

var grad = canvas.createLinearGradient(350,110,100,0);  //(x0,y0) to (x1,y1)
grad.addColorStop(0, red );
grad.addColorStop(1, yellow );
grad.fillStyle = grad;
canvas.fill();
canvas.stroke();

问题是,圈子的线梯度不工作。 圈子本身显示罚款。

在该法规之前,一号是“Ecanpo. 填埋场 = 青;”因此,环体是“青的,而不是 red的”。 也许会放弃某些内容。

Thanks! (btw i use chrome and this effect working fine on other things)

最佳回答

canvas. liverStyle = grad;, not grad.lifStyle = grad;!

使梯度完全达到你想要的东西是另一个问题:

It looks all red right now, but if you changed the x/y values you d be able to see the gradient. For instance:

var grad = canvas.createLinear Gradient (350,110,100,330);

trick。

http://jsfiddle.net/3EzUq/


I don t think you should call the context canvas. I d recommend ctx or context instead. It s not a big deal but you ll confuse collaborators someday.

问题回答

暂无回答




相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签