Как повернуть оттенок в JavaScript - PullRequest
0 голосов
/ 09 июня 2019

Я видел здесь spin функцию, которая идет от -360 до 360, что не имеет смысла для меня, я бы подумал, что это будет 0-360.

Я хотел бы расширить понятие дополнительного цвета, триады и тетрады (которые были встроены в другую библиотеку) и сгенерировать произвольный n-угольный эквивалент цветовой палитры, например, pentad, hexad, heptad и т. Д.Я пытался просто сделать angle * position, чтобы получить пентаду, но 2 из 5 цветов были дубликатами (это потому, что я иду с 0-360).

Не уверен, как заставить это работать.

1 Ответ

1 голос
/ 11 июня 2019

Причина, по которой вы можете выполнять ротацию от -360 до 360, хотя многие из них - это одно и то же, заключается в том, что они представляют собой все значения, которые вы концептуально используете.Итак, -20 градусов оттенка имеет смысл, так же как и +340 градусов оттенка, даже если это одно и то же.

var tc = tinycolor({
  r: Math.floor(Math.random() * 0xFF),
  g: Math.floor(Math.random() * 0xFF),
  b: Math.floor(Math.random() * 0xFF)
})
colors = []
var parts = 2 + Math.floor(Math.random() * 5);
for (var i = 0; i < parts; i++) {
  tc = tc.spin(360 / parts);
  colors.push('#' + tc.toHex())
}

div = document.createElement("div");
document.body.appendChild(div);
colors.forEach(function(element) {
  var d = document.createElement("button");
  d.style.cssText = 'padding:5px; font-size:22px; width:50px; height:50px; background-color:' + element;
  div.appendChild(d);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinycolor/1.4.1/tinycolor.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...