c0bra/color-scheme-js

Generate pleasant color schemes in JavaScript

color-scheme-js's Issues

register at bower.io

Mind registering your repo at bower.io as well?? Although I use npm I use bower for js frontend libraries as opposed to npm for actual node modules.

A main entry(s) in your bower.json is all that is needed.

Thx.

http://bower.io/docs/creating-packages/

TypeErrors for certain values of hue and dist

Hi,

I'm assuming that hue should be an int between 0-255 and distance a float between 0 and 1.
Given that, I've experienced the following error with various combinations of hue and distance:

TypeError: Cannot read property '0' of undefined
    at mutablecolor.ColorScheme.mutablecolor.mutablecolor.set_hue (../color-scheme/lib/color-scheme.js:505:49)
    at mutablecolor.ColorScheme.mutablecolor.mutablecolor.rotate (../color-scheme/lib/color-scheme.js:514:21)
    at Object.dispatch.triade (../color-scheme/lib/color-scheme.js:107:31)
    at ColorScheme.colors (../color-scheme/lib/color-scheme.js:134:31)

hue 170 and distance 0.16 will throw this error. This will list out some of the values:

/*jslint node:true, multistr: true */
'use strict';

var ColorScheme = require('color-scheme');

for(let hue = 0; hue < 256; hue++) {
  for(let dist = 0.0; dist < 1.0; dist+=0.01) {
    // try {
      let scheme = new ColorScheme();
      scheme.from_hue(hue)
        .scheme('triade')
        .variation('hard')
        .distance(dist);

      let colors = scheme.colors();
    } catch(err) {
      console.log(hue, dist, err);
    }
  }
}

Did I misunderstand something in the use of your library?

distance has no effect

Even when taken directly from the example, distance no effect. I'm not sure what function it is supposed to serve exactly, but from what I can see it makes no difference on the color scheme at all, no matter what value I insert.

ReferenceError: COLOR_WHEEL is not defined

Install and run on node 6.9
npm install color-scheme

let scheme = new ColorScheme();
        scheme.from_hex(mainColor)
            .scheme('triade')
            .distance(0.7)
            .variation('pastel');

Error:
ReferenceError: COLOR_WHEEL is not defined

Unexpected results with from_hex method and demo page

Hi,

Maybe I'm not understanding how this works, but I'm getting unexpected results with the from_hex method.

For example, if I input "ff0000" which is red, I get a hue of 0, which is OK:

var scheme = new ColorScheme;
scheme.from_hex("ff0000");
console.log(scheme.col[0].hue); // 0

However, if I input "00aa00", which is green, I also get a hue of 0. I'd expect it to be around 180 or maybe 0.5 since green is the opposite of red on the classic color wheel.

I see the same issue if I enter a hex value and click "set" on the demo page.

Is this a bug?

Light to dark or dark to light

I am trying to make a color info for a map regions. I need dark to light colors. I thought ı can use your library because simply going from base color to black does not create beautiful colors.

Do the library have an option to produce light to dark values?

"TypeError: colorset1 is undefined" when using the from_hex() method

Hi,

I am trying to get working your amazing lib in my project, but when I try to generate colors using the from_hex() method, I get the following error in the browser: TypeError: colorset1 is undefined (color-scheme.js:522:10)

I noticed that if I replaced from_hex() by the from_hue() method, it was working, so it sounds like a bug, that's why I'm posting it here.

In the debugger, at line 511, there is colorset1 = ColorScheme.COLOR_WHEEL[derivative1];, but derivative1 is set to -15, so that's why colorset1 is undefined... Have you any idea of the source of the problem?

Here is a sample of the code I used:

var theme = this.colorScheme.from_hex("AD1457")
                            .scheme('contrast')
                            .variation('light');

UPDATE: I just noticed that the problem occurs in the demo too when I try to put "AD1457" in the Hex field of http://c0bra.github.io/color-scheme-js/.

Thank you in advance & keep up the good work!

Methods could return their current value when no arguments are supplied.

Loving your library, thus far. I need to do the following:

var s = new ColorScheme;

s.scheme("mono");

if (s.scheme() === "bar") {
    ...
}

Currently s.scheme() throws an error scheme needs an argument. I am proposing to return the current value if the argument is null.

A work around is to the private property c._scheme though doing so feels not quite right.

I am willing to submit a pull request for the JavaScript. My CoffeeScript is not top notch but I am willing to give that a shot as well if you like.

Excellent Implementation

Looks like an excellent implementation. Played around for a few minutes to generate palettes with just 4 colors, selecting the most useful from what's generated rather than the first four. I'm excited to put this to use.

from RGB?

Register at cdnjs.cloudflare.com

Would you consider registering at cdnjs? It can be done via pull request: https://github.com/cdnjs/cdnjs

Can't make the complement options work

I just tried to make the complement option work like this, but it won't work. Could you help me out here?

<html>
	<head>
		<style>
			.card {
				width:25%;
				height:40px;
				float:left;
			}
		</style>
		<script src="color-scheme.min.js"></script>
		
		

		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>
		<div class="card"></div>

		<script>
			var scheme = new ColorScheme;
			var dist = 1;

			dist.toFixed(2);
			scheme.from_hue(21)   		 // Schemes and numner of colors
					.scheme('analogic')    // mono (4), contrast (8), triade (12), tetrade (16), analogic (12)
					.variation('hard')   // default (no change), pastel, soft, light, hard, pale
					//.distance(0.16) 		 // from 0 to 1, only works with triade, tetrade, analogic
					.complement(true);  	// only with analogic
					;
			var colors = scheme.colors();
			
			var divs = document.getElementsByClassName("card");

			var text="";
			while (divs.length > 0) {
				var i = Math.floor(Math.random() * colors.length);
				divs[0].style.backgroundColor = colors[i];
				colors.splice(i, 1);
				divs = [].slice.call(divs, 1);
			}
		
		</script>

</html>