search

goat1000 / TagCanvas

HTML5 canvas-based tag cloud
240 stars 81 forks source link

Additional options for tags #1

Open mrbubblesort opened 10 years ago

mrbubblesort commented 10 years ago

I added these options for tags: bgBox - (true|false) background box on/off bgBoxPadX - (int) x padding on tag bgBoxPadY - (int) y padding on tag bgBoxStroke - (string) outline color for bg box bgBoxColor - (string) color for bg box bgBoxRadius - (int) radius of bg box corners

For example, this would make the tags look like a bootstrap labels or buttons (http://getbootstrap.com/components/#labels): $('#tag-canvas').tagcanvas({ 'textColour' : '#FFFFFF', 'bgBox': true, 'bgBoxPadX' : 6, 'bgBoxPadY' : 10, 'bgBoxStroke' : "#5BC0DE", 'bgBoxColor' : "#5BC0DE", 'bgBoxRadius' : 5, });

nurikabe commented 10 years ago

+1 to make it easier to use with Bootstrap. Nice to see this library in GitHub.

goat1000 commented 10 years ago

I've had a quick look over this, and found a couple of minor problems:

  1. The padding and radius options don't take into account the "txtScale" value - this is easy to fix in the Tproto.Measure function by multiplying (like s * this.height and s * t.shadowBlur).
  2. With the "outlineMethod" set to "colour", the whole tag is opaque in the outline colour, so you can't read it. Not sure if there is an easy fix for this.
  3. Not really a problem, but "bgBoxColor" for the option name when I've spelled the other options "textColour" and "outlineColour" could cause confusion.

Otherwise, it looks good.

mrbubblesort commented 10 years ago

OK, no problem. I'll try to get that in this week then. Thanks for the input.

nurikabe commented 9 years ago

Bump