RGBカラーを配列から取り出す描画

Question

Javascriptを使用してロゴを描画しようとしていますが、固定されたパレットからランダムな色を選択する必要があります。

RGB値の配列としてカラーパレットを設定した後、乱数を使用して配列から1つの色を選択しています。

私はキャンバス円で描画された円の色として結果を使用したいと思います。

だから、これはダークパープル、円を描く必要があり、私がこれまで持っているコード...

// Define colour palette 

var DarkColourPalette = [ 
{ r:45, g:10, b:55 }, // Dark purple 
{ r:70, g:10, b:40 }, // Dark plum 
{ r:0, g:5, b:70 }, // Dark blue 
{ r:45, g:45, b:55 }, // Dark grey 
{ r:50, g:40, b:40 }, // Dark brown 
{ r:0, g:45, b:30 } // Dark green 
]; 
var DarkColours = DarkColourPalette.concat(); 

// Draw O 

    contxt.beginPath(); 
    contxt.arc(75, 40, 10, 0, 2 * Math.PI, false); 
    contxt.lineWidth = 10; 
    contxt.strokeStyle = "rgba(DarkColours[0],1)"; 
    contxt.stroke(); 

ですが、私がしようとするものに関係なく、私はコンテキストを取得することができていませんでした。 strokeStyleビットを使用して、配列からカラー値を受け入れます。それは単に黒を使用しています。ここで

は、それが手動で挿入されたカラー値を次のようになります。 http://codepen.io/RichardHolt/pen/mRRbpR

私はこの種のものに新たなんです。私はここで構文が間違っているのですか、間違ったツリーを吠えていますか？

Answer 1

この

contxt.strokeStyle = "rgba("+DarkColourPalette[0]["r"]+","+DarkColourPalette[0]["g"]+","+DarkColourPalette[0]["b"]+",1)"; 

または

"rgba(R,G,B,1)" 
       .replace("R",DarkColourPalette[2].r) 
       .replace("G",DarkColourPalette[2].g) 
       .replace("B",DarkColourPalette[2].b); 

`

Answer 2

のような読みやすくしてみてください任意の助けを事前に

おかげで...私は色の変更を行いましたpallate配列と、オブジェクトではなく文字列の形で定義された色。今度はページが読み込まれるたびに、定義されたカラーの色の中のランダムな色の円が表示されます。

// Define colour palette 

var DarkColourPalette = [ 
"rgba(45,10,55,1)", // Dark purple 
"rgba(70,10,40,1)", // Dark plum 
"rgba(0,5,70,1)", // Dark blue 
"rgba(45,45,55,1)", // Dark grey 
"rgba(50,40,40,1)", // Dark brown 
"rgba(0,45,30,1)" //Dark Green 
]; 
var DarkColours = DarkColourPalette.concat(); 

var canvas = document.getElementById('iON'); 
var contxt = canvas.getContext('2d'); 

contxt.scale (4,4); 

// Draw O 

contxt.beginPath(); 
contxt.arc(75, 40, 10, 0, 2 * Math.PI, false); 
contxt.lineWidth = 10; 
var index = Math.floor(Math.random() * 5) + 1; // If you want to generate random number between 0-6 
console.log(DarkColourPalette[index]); 
contxt.strokeStyle = DarkColourPalette[index]; 
contxt.stroke(); 

fiddleを更新してください。