Изменение цвета случайным образом Javascript

голоса
0

Хейс ребята,

Я тестирую некоторые вещи с родной accelometer на мой телефон андроид, я хочу рисовать прямоугольники, который работает, но я хочу, чтобы они были разного цвета каждый раз, когда один обращается.

Заранее спасибо :)

    function onSuccess(acceleration) {

var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
context.width = window.innerWidth;
context.height = window.innerHeight;

    context.save(); 
    context.beginPath();
    context.rect(acceleration.x*10+150, acceleration.y*10+100, acceleration.z*10, acceleration.y*10);
    context.fillStyle = '#FF0000';
    context.fill();
    context.lineWidth = 3;
    context.strokeStyle = 'black';
    context.stroke();
    context.restore(); 

}

function onError() {
    alert('onError!');
}
Задан 07/04/2016 в 06:11
пользователем
На других языках...                            


4 ответов

голоса
0

fillStyle должны иметь случайный цвет вместо '#FF0000'

Вы можете использовать randomцвет по Paul Irish

function onSuccess(acceleration) {
  var canvas = document.getElementById('myCanvas');
  var context = canvas.getContext('2d');
  context.width = window.innerWidth;
  context.height = window.innerHeight;
  context.save();
  context.beginPath();
  context.rect(acceleration.x * 10 + 150, acceleration.y * 10 + 100, acceleration.z * 10, acceleration.y * 10);
  context.fillStyle = '#' + Math.floor(Math.random() * 16777215).toString(16);
  context.fill();
  context.lineWidth = 3;
  context.strokeStyle = 'black';
  context.stroke();
  context.restore();
}

function onError() {
  alert('onError!');
}

Изменить: Как было предложено Мортен Ольсен , при условии подход может потерпеть неудачу иногда, Вы можете передать этот SO ответ

Ответил 07/04/2016 в 06:14
источник пользователем

голоса
0

Просто возьмите функцию для этого.

function randomColor() {
   var c = "#";
   for (var i = 0; i < 6; i++) {
       c += (Math.random() * 16 | 0).toString(16);
   } 
   return c;
}

var a = document.getElementById("id1").style;
a.color = randomColor();
<h1 id="id1">stackoverflow</h1>

Ответил 07/04/2016 в 06:15
источник пользователем

голоса
0

Назначают случайный цвет FillStyle.

 context.fillStyle = "#"+((1<<24)*Math.random()|0).toString(16);

С этого поста

Ответил 07/04/2016 в 06:16
источник пользователем

голоса
0

Использовать это:

'#'+Math.floor(Math.random()*16777215).toString(16);

Для получения дополнительной информации: http://www.paulirish.com/2009/random-hex-color-code-snippets/

Ответил 07/04/2016 в 06:17
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more