0

我的代码如下

 function myFunction(a,b,d)
        {
         var R  = a;
         var G =  b ;
         var B =  d ;
         var L = "(";
         var C = ",";
         var Rp = ")";
         var E = L ;
         var ic = '"';
         var prefix = "RGB";
         var color = ic+prefix + L + R+ C + G + C + B + Rp+ic;
         alert(color)
         var c=document.getElementById("myCanvas");
         var ctx=c.getContext("2d");
         ctx.fillStyle = color;
        }

如果我调用上述函数,例如myFunction(10,20,30); alert(color);打印“rgb(10,20,30)”,但我不知道如何将颜色值分配给 ctx.fillStyle 因为我想制作动态应用程序,我需要传递不同的颜色值,现在代码不起作用,并ctx.fillStyle = color;在执行代码时打印出来。如果有人能告诉我如何将颜色的值分配给 ctx.fillStyle 方法,我将不胜感激。

4

2 回答 2

0

首先,“颜色”在这里是一个字符串变量,并将其用作代码段使用eval();函数。其次,在画布中设置一些可见区域,以查看代码是否真正工作,即 ctx.fillRect()。最后,确保您的文档类型声明为<!DOCTYPE html>我希望的。

这是代码的工作版本(在 FF 11.0 中适用于我):

<!DOCTYPE html>
<html>
<head>
<script >
function myFunction(a,b,d)
            {
             var R  = a;
             var G =  b;
             var B =  d;
             var L = "(";
             var C = ",";
             var Rp = ")";
             var E = L ;
             var ic = '"';
             var prefix = "RGB";
             var color = ic+prefix + L + R+ C + G + C + B + Rp+ic;

    var c=document.getElementById("myCanvas");
    var ctx=c.getContext("2d");
    ctx.fillStyle=eval(color); //convert string to code.
    ctx.fillRect(0,0,150,75);//any size greater than 0
            }
</script>
<body>
<button  onclick="myFunction(200,0,0);">click me</button>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
</body>
</html>
于 2012-08-08T05:47:47.397 回答
0

您可以根据需要引用所需颜色值的变量,只要提供的值是有效的颜色值。

根据您提供的代码,您似乎正在使用RGB而不是rgb.

于 2012-08-08T05:46:48.383 回答