I want to ask that If have read that it is possible to give hsl color value to an svg element.But when I try it like this
var color = hsl(0, 100%, 50%);
circle.attr(fill , color);
I got an error unexpected number
Can any one guide what is the correct way and also does svg supports all hsl colors
Thanks
Simply
var color = hsl(0,100%,50%);
line means, that you call hsl function with 0 ,100%, 50% parameters, and assign returned value to color variable.
You need to use quotes, and pass color as a string:
var color = hsl(0, 100%, 50%);
circle.attr(fill , color);
For more information about HSL, read here.
And it doesn't metter whether the hsl color is used by SVG, or by other element. It's just a syntax for specifing color.
UPDATE: To give color variable random behavior, try something like this:
var color = hsl(+[0,0,0].map(function(){ return Math.round(100*Math.random())+%; }).join(',')+);
