RubyGems - graphael-rails - Versions diffs - 0.1.3 → 0.1.4 - Mend

graphael-rails 0.1.3 → 0.1.4

Files changed (45) hide show

data/vendor/assets/javascripts/g.raphael/docs/reference.html ADDED Viewed

@@ -0,0 +1,350 @@
+<!DOCTYPE html>
+<!-- Generated with Dr.js -->
+<html lang="en"><head><meta charset="utf-8"><title>g.Raphaël Reference</title><link rel="stylesheet" href="dr.css" media="screen"><link rel="stylesheet" href="dr-print.css" media="print"></head><body id="dr-js"><div id="dr"><ol class="dr-toc" id="dr-toc"><li class="dr-lvl0"><a href="#Element" class="{clas}"><span>Element</span></a></li><li class="dr-lvl1"><a href="#Element.blob" class="dr-method"><span>Element.blob()</span></a></li><li class="dr-lvl1"><a href="#Element.darker" class="dr-method"><span>Element.darker()</span></a></li><li class="dr-lvl1"><a href="#Element.drop" class="dr-method"><span>Element.drop()</span></a></li><li class="dr-lvl1"><a href="#Element.flag" class="dr-method"><span>Element.flag()</span></a></li><li class="dr-lvl1"><a href="#Element.label" class="dr-method"><span>Element.label()</span></a></li><li class="dr-lvl1"><a href="#Element.lighter" class="dr-method"><span>Element.lighter()</span></a></li><li class="dr-lvl1"><a href="#Element.popup" class="dr-method"><span>Element.popup()</span></a></li><li class="dr-lvl1"><a href="#Element.resetBrightness" class="dr-method"><span>Element.resetBrightness()</span></a></li><li class="dr-lvl1"><a href="#Element.tag" class="dr-method"><span>Element.tag()</span></a></li><li class="dr-lvl0"><a href="#Paper" class="{clas}"><span>Paper</span></a></li><li class="dr-lvl1"><a href="#Paper.blob" class="dr-method"><span>Paper.blob()</span></a></li><li class="dr-lvl1"><a href="#Paper.drop" class="dr-method"><span>Paper.drop()</span></a></li><li class="dr-lvl1"><a href="#Paper.flag" class="dr-method"><span>Paper.flag()</span></a></li><li class="dr-lvl1"><a href="#Paper.label" class="dr-method"><span>Paper.label()</span></a></li><li class="dr-lvl1"><a href="#Paper.popup" class="dr-method"><span>Paper.popup()</span></a></li><li class="dr-lvl1"><a href="#Paper.tag" class="dr-method"><span>Paper.tag()</span></a></li><li class="dr-lvl0"><a href="#g" class="{clas}"><span>g</span></a></li><li class="dr-lvl1"><a href="#g.colors" class="dr-array"><span>g.colors</span></a></li><li class="dr-lvl1"><a href="#g.shim" class="dr-object"><span>g.shim</span></a></li><li class="dr-lvl1"><a href="#g.txtattr" class="dr-object"><span>g.txtattr</span></a></li></ol><div class="dr-doc"><h1>g.Raphaël Reference</h1><div class="Element-section"><h2 id="Element" class="undefined"><i class="dr-trixie">&#160;</i>Element<a href="#Element" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<div class="extra" id="Element-extra"></div></div><div class="Element-blob-section"><h3 id="Element.blob" class="dr-method"><i class="dr-trixie">&#160;</i>Element.blob(angle, x, y)<a href="#Element.blob" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 375 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L375">&#x27ad;</a></h3>
+<div class="extra" id="Element.blob-extra"></div></div><div class="dr-method"><p>Puts the context Element in a 'blob' tooltip. Can also be used on sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+<dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the blob's tail [default: Element's <code>x</code> or <code>cx</code>]</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the blob's tail [default: Element's <code>x</code> or <code>cx</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">path element of the blob</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">8</span>).attr({
+    stroke: <i>"#fff"</i>,
+    fill: <i>"<span class="d">0</span>-#c9de96-#8ab66b:<span class="d">44</span>-#<span class="d">398235</span>"</i>
+}).blob(<span class="d">60</span>);
+</code></pre>
+</div><div class="Element-darker-section"><h3 id="Element.darker" class="dr-method"><i class="dr-trixie">&#160;</i>Element.darker(times)<a href="#Element.darker" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 633 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L633">&#x27ad;</a></h3>
+<div class="extra" id="Element.darker-extra"></div></div><div class="dr-method"><p>Makes the context element darker by decreasing the brightness and increasing the saturation by a given factor. Can be called on Sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">times</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">adjustment factor [default: <code>2</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">20</span>).attr({
+    fill: <i>"#ff0000"</i>,
+    stroke: <i>"#fff"</i>,
+    <i>"stroke-width"</i>: <span class="d">2</span>
+}).darker(<span class="d">6</span>);
+</code></pre>
+</div><div class="Element-drop-section"><h3 id="Element.drop" class="dr-method"><i class="dr-trixie">&#160;</i>Element.drop(angle, x, y)<a href="#Element.drop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 225 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L225">&#x27ad;</a></h3>
+<div class="extra" id="Element.drop-extra"></div></div><div class="dr-method"><p>Puts the context Element in a 'drop' tooltip. Can also be used on sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+<dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the drop's point [default: Element's <code>x</code> or <code>cx</code>]</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the drop's point [default: Element's <code>x</code> or <code>cx</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">path element of the drop</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">8</span>).attr({
+    stroke: <i>"#fff"</i>,
+    fill: <i>"<span class="d">0</span>-#c9de96-#8ab66b:<span class="d">44</span>-#<span class="d">398235</span>"</i>
+}).drop(<span class="d">60</span>);
+</code></pre>
+</div><div class="Element-flag-section"><h3 id="Element.flag" class="dr-method"><i class="dr-trixie">&#160;</i>Element.flag(angle, x, y)<a href="#Element.flag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 281 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L281">&#x27ad;</a></h3>
+<div class="extra" id="Element.flag-extra"></div></div><div class="dr-method"><p>Puts the context Element in a 'flag' tooltip. Can also be used on sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+<dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the flag's point [default: Element's <code>x</code> or <code>cx</code>]</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the flag's point [default: Element's <code>x</code> or <code>cx</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">path element of the flag</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">10</span>).attr({
+    stroke: <i>"#fff"</i>,
+    fill: <i>"<span class="d">0</span>-#c9de96-#8ab66b:<span class="d">44</span>-#<span class="d">398235</span>"</i>
+}).flag(<span class="d">60</span>);
+</code></pre>
+</div><div class="Element-label-section"><h3 id="Element.label" class="dr-method"><i class="dr-trixie">&#160;</i>Element.label()<a href="#Element.label" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 346 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L346">&#x27ad;</a></h3>
+<div class="extra" id="Element.label-extra"></div></div><div class="dr-method"><p>Puts the context Element in a 'label' tooltip. Can also be used on sets.
+</p>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">path element of the label.</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">10</span>).attr({
+    stroke: <i>"#fff"</i>,
+    fill: <i>"<span class="d">0</span>-#c9de96-#8ab66b:<span class="d">44</span>-#<span class="d">398235</span>"</i>
+}).label();
+</code></pre>
+</div><div class="Element-lighter-section"><h3 id="Element.lighter" class="dr-method"><i class="dr-trixie">&#160;</i>Element.lighter(times)<a href="#Element.lighter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 597 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L597">&#x27ad;</a></h3>
+<div class="extra" id="Element.lighter-extra"></div></div><div class="dr-method"><p>Makes the context element lighter by increasing the brightness and reducing the saturation by a given factor. Can be called on Sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">times</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">adjustment factor [default: <code>2</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">20</span>).attr({
+    fill: <i>"#ff0000"</i>,
+    stroke: <i>"#fff"</i>,
+    <i>"stroke-width"</i>: <span class="d">2</span>
+}).lighter(<span class="d">6</span>);
+</code></pre>
+</div><div class="Element-popup-section"><h3 id="Element.popup" class="dr-method"><i class="dr-trixie">&#160;</i>Element.popup(dir, size, x, y)<a href="#Element.popup" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 24 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L24">&#x27ad;</a></h3>
+<div class="extra" id="Element.popup-extra"></div></div><div class="dr-method"><p>Puts the context Element in a 'popup' tooltip. Can also be used on sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">dir</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">location of Element relative to the tail: <code>'down'</code>, <code>'left'</code>, <code>'up'</code> [default], or <code>'right'</code>.</dd>
+<dt class="dr-param">size</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">amount of bevel/padding around the Element, as well as half the width and height of the tail [default: <code>5</code>]</dd>
+<dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the popup's tail [default: Element's <code>x</code> or <code>cx</code>]</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the popup's tail [default: Element's <code>y</code> or <code>cy</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">path element of the popup</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">5</span>).attr({
+    stroke: <i>"#fff"</i>,
+    fill: <i>"<span class="d">0</span>-#c9de96-#8ab66b:<span class="d">44</span>-#<span class="d">398235</span>"</i>
+}).popup();
+</code></pre>
+</div><div class="Element-resetBrightness-section"><h3 id="Element.resetBrightness" class="dr-method"><i class="dr-trixie">&#160;</i>Element.resetBrightness()<a href="#Element.resetBrightness" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 665 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L665">&#x27ad;</a></h3>
+<div class="extra" id="Element.resetBrightness-extra"></div></div><div class="dr-method"><p>Resets brightness and saturation levels to their original values. See <a href="#Element.lighter" class="dr-link">Element.lighter</a> and <a href="#Element.darker" class="dr-link">Element.darker</a>. Can be called on Sets.
+</p>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">20</span>).attr({
+    fill: <i>"#ff0000"</i>,
+    stroke: <i>"#fff"</i>,
+    <i>"stroke-width"</i>: <span class="d">2</span>
+}).lighter(<span class="d">6</span>).resetBrightness();
+</code></pre>
+</div><div class="Element-tag-section"><h3 id="Element.tag" class="dr-method"><i class="dr-trixie">&#160;</i>Element.tag(angle, r, x, y)<a href="#Element.tag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 135 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L135">&#x27ad;</a></h3>
+<div class="extra" id="Element.tag-extra"></div></div><div class="dr-method"><p>Puts the context Element in a 'tag' tooltip. Can also be used on sets.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+<dt class="dr-param">r</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">radius of the loop [default: <code>5</code>]</dd>
+<dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the center of the tag loop [default: Element's <code>x</code> or <code>cx</code>]</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the center of the tag loop [default: Element's <code>x</code> or <code>cx</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">path element of the tag</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">15</span>).attr({
+    stroke: <i>"#fff"</i>,
+    fill: <i>"<span class="d">0</span>-#c9de96-#8ab66b:<span class="d">44</span>-#<span class="d">398235</span>"</i>
+}).tag(<span class="d">60</span>);
+</code></pre>
+</div><div class="Paper-section"><h2 id="Paper" class="undefined"><i class="dr-trixie">&#160;</i>Paper<a href="#Paper" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<div class="extra" id="Paper-extra"></div></div><div class="Paper-blob-section"><h3 id="Paper.blob" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.blob(x, y, text, angle)<a href="#Paper.blob" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 569 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L569">&#x27ad;</a></h3>
+<div class="extra" id="Paper.blob-extra"></div></div><div class="dr-method"><p>Puts the given text into a 'blob' tooltip. The text is given a default style according to <a href="#g.txtattr" class="dr-link">g.txtattr</a>. See <a href="#Element.blob" class="dr-link">Element.blob</a>
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the blob's tail</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the blob's tail</dd>
+<dt class="dr-param">text</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">text to place inside the blob</dd>
+<dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set containing the blob path and the text element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.blob(<span class="d">50</span>, <span class="d">50</span>, <i>"$<span class="d">9.99</span>"</i>, <span class="d">60</span>);
+</code></pre>
+</div><div class="Paper-drop-section"><h3 id="Paper.drop" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.drop(x, y, text, angle)<a href="#Paper.drop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 545 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L545">&#x27ad;</a></h3>
+<div class="extra" id="Paper.drop-extra"></div></div><div class="dr-method"><p>Puts the given text into a 'drop' tooltip. The text is given a default style according to <a href="#g.txtattr" class="dr-link">g.txtattr</a>. See <a href="#Element.drop" class="dr-link">Element.drop</a>
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the drop's point</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the drop's point</dd>
+<dt class="dr-param">text</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">text to place inside the drop</dd>
+<dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set containing the drop path and the text element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.drop(<span class="d">50</span>, <span class="d">50</span>, <i>"$<span class="d">9.99</span>"</i>, <span class="d">60</span>);
+</code></pre>
+</div><div class="Paper-flag-section"><h3 id="Paper.flag" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.flag(x, y, text, angle)<a href="#Paper.flag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 521 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L521">&#x27ad;</a></h3>
+<div class="extra" id="Paper.flag-extra"></div></div><div class="dr-method"><p>Puts the given <code>text</code> into a 'flag' tooltip. The text is given a default style according to <a href="#g.txtattr" class="dr-link">g.txtattr</a>. See <a href="#Element.flag" class="dr-link">Element.flag</a>
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the flag's point</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the flag's point</dd>
+<dt class="dr-param">text</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">text to place inside the flag</dd>
+<dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set containing the flag path and the text element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.flag(<span class="d">50</span>, <span class="d">50</span>, <i>"$<span class="d">9.99</span>"</i>, <span class="d">60</span>);
+</code></pre>
+</div><div class="Paper-label-section"><h3 id="Paper.label" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.label(x, y, text)<a href="#Paper.label" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 445 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L445">&#x27ad;</a></h3>
+<div class="extra" id="Paper.label-extra"></div></div><div class="dr-method"><p>Puts the given <code>text</code> into a 'label' tooltip. The text is given a default style according to <a href="#g.txtattr" class="dr-link">g.txtattr</a>. See <a href="#Element.label" class="dr-link">Element.label</a>
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the center of the label</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the center of the label</dd>
+<dt class="dr-param">text</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">text to place inside the label</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set containing the label path and the text element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.label(<span class="d">50</span>, <span class="d">50</span>, <i>"$<span class="d">9.99</span>"</i>);
+</code></pre>
+</div><div class="Paper-popup-section"><h3 id="Paper.popup" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.popup(x, y, text, dir, size)<a href="#Paper.popup" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 472 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L472">&#x27ad;</a></h3>
+<div class="extra" id="Paper.popup-extra"></div></div><div class="dr-method"><p>Puts the given <code>text</code> into a 'popup' tooltip. The text is given a default style according to <a href="#g.txtattr" class="dr-link">g.txtattr</a>. See <a href="#Element.popup" class="dr-link">Element.popup</a>
+</p>
+<p>Note: The <code>dir</code> parameter has changed from g.Raphael 0.4.1 to 0.5. The options <code>0</code>, <code>1</code>, <code>2</code>, and <code>3</code> has been changed to <code>'down'</code>, <code>'left'</code>, <code>'up'</code>, and <code>'right'</code> respectively.
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the popup's tail</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the popup's tail</dd>
+<dt class="dr-param">text</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">text to place inside the popup</dd>
+<dt class="dr-param">dir</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">location of the text relative to the tail: <code>'down'</code>, <code>'left'</code>, <code>'up'</code> [default], or <code>'right'</code>.</dd>
+<dt class="dr-param">size</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">amount of padding around the Element [default: <code>5</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set containing the popup path and the text element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.popup(<span class="d">50</span>, <span class="d">50</span>, <i>"$<span class="d">9.99</span>"</i>, <i>'down'</i>);
+</code></pre>
+</div><div class="Paper-tag-section"><h3 id="Paper.tag" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.tag(x, y, text, angle, r)<a href="#Paper.tag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 497 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L497">&#x27ad;</a></h3>
+<div class="extra" id="Paper.tag-extra"></div></div><div class="dr-method"><p>Puts the given text into a 'tag' tooltip. The text is given a default style according to <a href="#g.txtattr" class="dr-link">g.txtattr</a>. See <a href="#Element.tag" class="dr-link">Element.tag</a>
+</p>
+<p class="header">Parameters
+</p>
+<dl class="dr-parameters"><dt class="dr-param">x</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">x coordinate of the center of the tag loop</dd>
+<dt class="dr-param">y</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">y coordinate of the center of the tag loop</dd>
+<dt class="dr-param">text</dt>
+<dd class="dr-type"><em class="dr-type-string">string</em></dd>
+<dd class="dr-description">text to place inside the tag</dd>
+<dt class="dr-param">angle</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">angle of orientation in degrees [default: <code>0</code>]</dd>
+<dt class="dr-param">r</dt>
+<dd class="dr-type"><em class="dr-type-number">number</em></dd>
+<dd class="dr-description">radius of the loop [default: <code>5</code>]</dd>
+</dl>
+<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set containing the tag path and the text element</span></p>
+<p class="header">Usage
+</p>
+<pre class="javascript code"><code>paper.tag(<span class="d">50</span>, <span class="d">50</span>, <i>"$<span class="d">9.99</span>"</i>, <span class="d">60</span>);
+</code></pre>
+</div><div class="g-section"><h2 id="g" class="undefined"><i class="dr-trixie">&#160;</i>g<a href="#g" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<div class="extra" id="g-extra"></div></div><div class="g-colors-section"><h3 id="g.colors" class="dr-array"><i class="dr-trixie">&#160;</i>g.colors<a href="#g.colors" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 726 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L726">&#x27ad;</a></h3>
+<div class="extra" id="g.colors-extra"></div></div><div class="dr-array"><p>An array of color values that charts will iterate through when drawing chart data values.
+</p>
+</div><div class="g-shim-section"><h3 id="g.shim" class="dr-object"><i class="dr-trixie">&#160;</i>g.shim<a href="#g.shim" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 706 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L706">&#x27ad;</a></h3>
+<div class="extra" id="g.shim-extra"></div></div><div class="dr-object"><p>An attribute object that charts will set on all generated shims (shims being the invisible objects that mouse events are bound to)
+</p>
+<p class="header">Default value
+</p>
+<pre class="javascript code"><code>{ stroke: <i>'none'</i>, fill: <i>'#<span class="d">000</span>'</i>, <i>'fill-opacity'</i>: <span class="d">0</span> }
+</code></pre>
+</div><div class="g-txtattr-section"><h3 id="g.txtattr" class="dr-object"><i class="dr-trixie">&#160;</i>g.txtattr<a href="#g.txtattr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 717 in the source" href="https://github.com/DmitryBaranovskiy/g.raphael/blob/master/g.raphael.js#L717">&#x27ad;</a></h3>
+<div class="extra" id="g.txtattr-extra"></div></div><div class="dr-object"><p>An attribute object that charts and tooltips will set on any generated text
+</p>
+<p class="header">Default value
+</p>
+<pre class="javascript code"><code>{ font: <i>'12px Arial, sans-serif'</i>, fill: <i>'#fff'</i> }
+</code></pre>
+</div></div></div>
+<script src="../raphael-min.js"></script>
+<script src="../g.raphael.js"></script>
+<script src="reference.js"></script>
+</body></html>

data/vendor/assets/javascripts/g.raphael/docs/reference.js ADDED Viewed

@@ -0,0 +1,35 @@
+Raphael(function () {
+    var grad = {
+            stroke: "#fff",
+            fill: "0-#c9de96-#8ab66b:44-#398235"
+        },
+        fill = {
+            stroke: "#fff",
+            fill: "#ff0000",
+            "stroke-width": 2
+        };
+    function prepare(id) {
+        var div = document.getElementById(id);
+        div.style.cssText = "display:block;float:right;padding:10px;width:99px;height:99px;background:#2C53B0 url(./blueprint-min.png) no-repeat";
+        return Raphael(div, 99, 99);
+    }
+    prepare("Element.popup-extra").circle(50, 50, 5).attr(grad).popup();
+    prepare("Element.tag-extra").circle(50, 50, 15).attr(grad).tag(60);
+    prepare("Element.drop-extra").circle(50, 50, 8).attr(grad).drop(60);
+    prepare("Element.flag-extra").circle(50, 50, 10).attr(grad).flag(60);
+    prepare("Element.label-extra").circle(50, 50, 10).attr(grad).label();
+    prepare("Element.blob-extra").circle(50, 50, 8).attr(grad).blob(60);
+    prepare("Paper.popup-extra").popup(50, 50, "Hello", 'down');
+    prepare("Paper.tag-extra").tag(50, 50, "$9.99", 60);
+    prepare("Paper.drop-extra").drop(50, 50, "$10", 60);
+    prepare("Paper.flag-extra").flag(50, 50, "$9.99", 60);
+    prepare("Paper.label-extra").label(50, 50, "$9.99");
+    prepare("Paper.blob-extra").blob(50, 50, "Hello", 60);
+    prepare("Element.lighter-extra").circle(50, 50, 20).attr(fill).lighter(6);
+    prepare("Element.darker-extra").circle(50, 50, 20).attr(fill).darker(6);
+    prepare("Element.resetBrightness-extra").circle(50, 50, 20).attr(fill).lighter(6).resetBrightness();
+});

data/vendor/assets/javascripts/g.raphael/g.bar.js ADDED Viewed

@@ -0,0 +1,621 @@
+/*!
+ * g.Raphael 0.5 - Charting library, based on Raphaël
+ *
+ * Copyright (c) 2009 Dmitry Baranovskiy (http://g.raphaeljs.com)
+ * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
+ */
+(function () {
+    var mmin = Math.min,
+        mmax = Math.max;
+    function finger(x, y, width, height, dir, ending, isPath, paper) {
+        var path,
+            ends = { round: 'round', sharp: 'sharp', soft: 'soft', square: 'square' };
+        // dir 0 for horizontal and 1 for vertical
+        if ((dir && !height) || (!dir && !width)) {
+            return isPath ? "" : paper.path();
+        }
+        ending = ends[ending] || "square";
+        height = Math.round(height);
+        width = Math.round(width);
+        x = Math.round(x);
+        y = Math.round(y);
+        switch (ending) {
+            case "round":
+                if (!dir) {
+                    var r = ~~(height / 2);
+                    if (width < r) {
+                        r = width;
+                        path = [
+                            "M", x + .5, y + .5 - ~~(height / 2),
+                            "l", 0, 0,
+                            "a", r, ~~(height / 2), 0, 0, 1, 0, height,
+                            "l", 0, 0,
+                            "z"
+                        ];
+                    } else {
+                        path = [
+                            "M", x + .5, y + .5 - r,
+                            "l", width - r, 0,
+                            "a", r, r, 0, 1, 1, 0, height,
+                            "l", r - width, 0,
+                            "z"
+                        ];
+                    }
+                } else {
+                    r = ~~(width / 2);
+                    if (height < r) {
+                        r = height;
+                        path = [
+                            "M", x - ~~(width / 2), y,
+                            "l", 0, 0,
+                            "a", ~~(width / 2), r, 0, 0, 1, width, 0,
+                            "l", 0, 0,
+                            "z"
+                        ];
+                    } else {
+                        path = [
+                            "M", x - r, y,
+                            "l", 0, r - height,
+                            "a", r, r, 0, 1, 1, width, 0,
+                            "l", 0, height - r,
+                            "z"
+                        ];
+                    }
+                }
+                break;
+            case "sharp":
+                if (!dir) {
+                    var half = ~~(height / 2);
+                    path = [
+                        "M", x, y + half,
+                        "l", 0, -height, mmax(width - half, 0), 0, mmin(half, width), half, -mmin(half, width), half + (half * 2 < height),
+                        "z"
+                    ];
+                } else {
+                    half = ~~(width / 2);
+                    path = [
+                        "M", x + half, y,
+                        "l", -width, 0, 0, -mmax(height - half, 0), half, -mmin(half, height), half, mmin(half, height), half,
+                        "z"
+                    ];
+                }
+                break;
+            case "square":
+                if (!dir) {
+                    path = [
+                        "M", x, y + ~~(height / 2),
+                        "l", 0, -height, width, 0, 0, height,
+                        "z"
+                    ];
+                } else {
+                    path = [
+                        "M", x + ~~(width / 2), y,
+                        "l", 1 - width, 0, 0, -height, width - 1, 0,
+                        "z"
+                    ];
+                }
+                break;
+            case "soft":
+                if (!dir) {
+                    r = mmin(width, Math.round(height / 5));
+                    path = [
+                        "M", x + .5, y + .5 - ~~(height / 2),
+                        "l", width - r, 0,
+                        "a", r, r, 0, 0, 1, r, r,
+                        "l", 0, height - r * 2,
+                        "a", r, r, 0, 0, 1, -r, r,
+                        "l", r - width, 0,
+                        "z"
+                    ];
+                } else {
+                    r = mmin(Math.round(width / 5), height);
+                    path = [
+                        "M", x - ~~(width / 2), y,
+                        "l", 0, r - height,
+                        "a", r, r, 0, 0, 1, r, -r,
+                        "l", width - 2 * r, 0,
+                        "a", r, r, 0, 0, 1, r, r,
+                        "l", 0, height - r,
+                        "z"
+                    ];
+                }
+        }
+        if (isPath) {
+            return path.join(",");
+        } else {
+            return paper.path(path);
+        }
+    }
+    /*
+     * Vertical Barchart
+     */
+    function VBarchart(paper, x, y, width, height, values, opts) {
+        opts = opts || {};
+        var chartinst = this,
+            type = opts.type || "square",
+            gutter = parseFloat(opts.gutter || "20%"),
+            chart = paper.set(),
+            bars = paper.set(),
+            covers = paper.set(),
+            covers2 = paper.set(),
+            total = Math.max.apply(Math, values),
+            stacktotal = [],
+            multi = 0,
+            colors = opts.colors || chartinst.colors,
+            len = values.length;
+        if (Raphael.is(values[0], "array")) {
+            total = [];
+            multi = len;
+            len = 0;
+            for (var i = values.length; i--;) {
+                bars.push(paper.set());
+                total.push(Math.max.apply(Math, values[i]));
+                len = Math.max(len, values[i].length);
+            }
+            if (opts.stacked) {
+                for (var i = len; i--;) {
+                    var tot = 0;
+                    for (var j = values.length; j--;) {
+                        tot +=+ values[j][i] || 0;
+                    }
+                    stacktotal.push(tot);
+                }
+            }
+            for (var i = values.length; i--;) {
+                if (values[i].length < len) {
+                    for (var j = len; j--;) {
+                        values[i].push(0);
+                    }
+                }
+            }
+            total = Math.max.apply(Math, opts.stacked ? stacktotal : total);
+        }
+        total = (opts.to) || total;
+        var barwidth = width / (len * (100 + gutter) + gutter) * 100,
+            barhgutter = barwidth * gutter / 100,
+            barvgutter = opts.vgutter == null ? 20 : opts.vgutter,
+            stack = [],
+            X = x + barhgutter,
+            Y = (height - 2 * barvgutter) / total;
+        if (!opts.stretch) {
+            barhgutter = Math.round(barhgutter);
+            barwidth = Math.floor(barwidth);
+        }
+        !opts.stacked && (barwidth /= multi || 1);
+        for (var i = 0; i < len; i++) {
+            stack = [];
+            for (var j = 0; j < (multi || 1); j++) {
+                var h = Math.round((multi ? values[j][i] : values[i]) * Y),
+                    top = y + height - barvgutter - h,
+                    bar = finger(Math.round(X + barwidth / 2), top + h, barwidth, h, true, type, null, paper).attr({ stroke: "none", fill: colors[multi ? j : i] });
+                if (multi) {
+                    bars[j].push(bar);
+                } else {
+                    bars.push(bar);
+                }
+                bar.y = top;
+                bar.x = Math.round(X + barwidth / 2);
+                bar.w = barwidth;
+                bar.h = h;
+                bar.value = multi ? values[j][i] : values[i];
+                if (!opts.stacked) {
+                    X += barwidth;
+                } else {
+                    stack.push(bar);
+                }
+            }
+            if (opts.stacked) {
+                var cvr;
+                covers2.push(cvr = paper.rect(stack[0].x - stack[0].w / 2, y, barwidth, height).attr(chartinst.shim));
+                cvr.bars = paper.set();
+                var size = 0;
+                for (var s = stack.length; s--;) {
+                    stack[s].toFront();
+                }
+                for (var s = 0, ss = stack.length; s < ss; s++) {
+                    var bar = stack[s],
+                        cover,
+                        h = (size + bar.value) * Y,
+                        path = finger(bar.x, y + height - barvgutter - !!size * .5, barwidth, h, true, type, 1, paper);
+                    cvr.bars.push(bar);
+                    size && bar.attr({path: path});
+                    bar.h = h;
+                    bar.y = y + height - barvgutter - !!size * .5 - h;
+                    covers.push(cover = paper.rect(bar.x - bar.w / 2, bar.y, barwidth, bar.value * Y).attr(chartinst.shim));
+                    cover.bar = bar;
+                    cover.value = bar.value;
+                    size += bar.value;
+                }
+                X += barwidth;
+            }
+            X += barhgutter;
+        }
+        covers2.toFront();
+        X = x + barhgutter;
+        if (!opts.stacked) {
+            for (var i = 0; i < len; i++) {
+                for (var j = 0; j < (multi || 1); j++) {
+                    var cover;
+                    covers.push(cover = paper.rect(Math.round(X), y + barvgutter, barwidth, height - barvgutter).attr(chartinst.shim));
+                    cover.bar = multi ? bars[j][i] : bars[i];
+                    cover.value = cover.bar.value;
+                    X += barwidth;
+                }
+                X += barhgutter;
+            }
+        }
+        chart.label = function (labels, isBottom) {
+            labels = labels || [];
+            this.labels = paper.set();
+            var L, l = -Infinity;
+            if (opts.stacked) {
+                for (var i = 0; i < len; i++) {
+                    var tot = 0;
+                    for (var j = 0; j < (multi || 1); j++) {
+                        tot += multi ? values[j][i] : values[i];
+                        if (j == multi - 1) {
+                            var label = paper.labelise(labels[i], tot, total);
+                            L = paper.text(bars[i * (multi || 1) + j].x, y + height - barvgutter / 2, label).attr(txtattr).insertBefore(covers[i * (multi || 1) + j]);
+                            var bb = L.getBBox();
+                            if (bb.x - 7 < l) {
+                                L.remove();
+                            } else {
+                                this.labels.push(L);
+                                l = bb.x + bb.width;
+                            }
+                        }
+                    }
+                }
+            } else {
+                for (var i = 0; i < len; i++) {
+                    for (var j = 0; j < (multi || 1); j++) {
+                        var label = paper.labelise(multi ? labels[j] && labels[j][i] : labels[i], multi ? values[j][i] : values[i], total);
+                        L = paper.text(bars[i * (multi || 1) + j].x, isBottom ? y + height - barvgutter / 2 : bars[i * (multi || 1) + j].y - 10, label).attr(txtattr).insertBefore(covers[i * (multi || 1) + j]);
+                        var bb = L.getBBox();
+                        if (bb.x - 7 < l) {
+                            L.remove();
+                        } else {
+                            this.labels.push(L);
+                            l = bb.x + bb.width;
+                        }
+                    }
+                }
+            }
+            return this;
+        };
+        chart.hover = function (fin, fout) {
+            covers2.hide();
+            covers.show();
+            covers.mouseover(fin).mouseout(fout);
+            return this;
+        };
+        chart.hoverColumn = function (fin, fout) {
+            covers.hide();
+            covers2.show();
+            fout = fout || function () {};
+            covers2.mouseover(fin).mouseout(fout);
+            return this;
+        };
+        chart.click = function (f) {
+            covers2.hide();
+            covers.show();
+            covers.click(f);
+            return this;
+        };
+        chart.each = function (f) {
+            if (!Raphael.is(f, "function")) {
+                return this;
+            }
+            for (var i = covers.length; i--;) {
+                f.call(covers[i]);
+            }
+            return this;
+        };
+        chart.eachColumn = function (f) {
+            if (!Raphael.is(f, "function")) {
+                return this;
+            }
+            for (var i = covers2.length; i--;) {
+                f.call(covers2[i]);
+            }
+            return this;
+        };
+        chart.clickColumn = function (f) {
+            covers.hide();
+            covers2.show();
+            covers2.click(f);
+            return this;
+        };
+        chart.push(bars, covers, covers2);
+        chart.bars = bars;
+        chart.covers = covers;
+        return chart;
+    };
+    /**
+     * Horizontal Barchart
+     */
+    function HBarchart(paper, x, y, width, height, values, opts) {
+        opts = opts || {};
+        var chartinst = this,
+            type = opts.type || "square",
+            gutter = parseFloat(opts.gutter || "20%"),
+            chart = paper.set(),
+            bars = paper.set(),
+            covers = paper.set(),
+            covers2 = paper.set(),
+            total = Math.max.apply(Math, values),
+            stacktotal = [],
+            multi = 0,
+            colors = opts.colors || chartinst.colors,
+            len = values.length;
+        if (Raphael.is(values[0], "array")) {
+            total = [];
+            multi = len;
+            len = 0;
+            for (var i = values.length; i--;) {
+                bars.push(paper.set());
+                total.push(Math.max.apply(Math, values[i]));
+                len = Math.max(len, values[i].length);
+            }
+            if (opts.stacked) {
+                for (var i = len; i--;) {
+                    var tot = 0;
+                    for (var j = values.length; j--;) {
+                        tot +=+ values[j][i] || 0;
+                    }
+                    stacktotal.push(tot);
+                }
+            }
+            for (var i = values.length; i--;) {
+                if (values[i].length < len) {
+                    for (var j = len; j--;) {
+                        values[i].push(0);
+                    }
+                }
+            }
+            total = Math.max.apply(Math, opts.stacked ? stacktotal : total);
+        }
+        total = (opts.to) || total;
+        var barheight = Math.floor(height / (len * (100 + gutter) + gutter) * 100),
+            bargutter = Math.floor(barheight * gutter / 100),
+            stack = [],
+            Y = y + bargutter,
+            X = (width - 1) / total;
+        !opts.stacked && (barheight /= multi || 1);
+        for (var i = 0; i < len; i++) {
+            stack = [];
+            for (var j = 0; j < (multi || 1); j++) {
+                var val = multi ? values[j][i] : values[i],
+                    bar = finger(x, Y + barheight / 2, Math.round(val * X), barheight - 1, false, type, null, paper).attr({stroke: "none", fill: colors[multi ? j : i]});
+                if (multi) {
+                    bars[j].push(bar);
+                } else {
+                    bars.push(bar);
+                }
+                bar.x = x + Math.round(val * X);
+                bar.y = Y + barheight / 2;
+                bar.w = Math.round(val * X);
+                bar.h = barheight;
+                bar.value = +val;
+                if (!opts.stacked) {
+                    Y += barheight;
+                } else {
+                    stack.push(bar);
+                }
+            }
+            if (opts.stacked) {
+                var cvr = paper.rect(x, stack[0].y - stack[0].h / 2, width, barheight).attr(chartinst.shim);
+                covers2.push(cvr);
+                cvr.bars = paper.set();
+                var size = 0;
+                for (var s = stack.length; s--;) {
+                    stack[s].toFront();
+                }
+                for (var s = 0, ss = stack.length; s < ss; s++) {
+                    var bar = stack[s],
+                        cover,
+                        val = Math.round((size + bar.value) * X),
+                        path = finger(x, bar.y, val, barheight - 1, false, type, 1, paper);
+                    cvr.bars.push(bar);
+                    size && bar.attr({ path: path });
+                    bar.w = val;
+                    bar.x = x + val;
+                    covers.push(cover = paper.rect(x + size * X, bar.y - bar.h / 2, bar.value * X, barheight).attr(chartinst.shim));
+                    cover.bar = bar;
+                    size += bar.value;
+                }
+                Y += barheight;
+            }
+            Y += bargutter;
+        }
+        covers2.toFront();
+        Y = y + bargutter;
+        if (!opts.stacked) {
+            for (var i = 0; i < len; i++) {
+                for (var j = 0; j < (multi || 1); j++) {
+                    var cover = paper.rect(x, Y, width, barheight).attr(chartinst.shim);
+                    covers.push(cover);
+                    cover.bar = multi ? bars[j][i] : bars[i];
+                    cover.value = cover.bar.value;
+                    Y += barheight;
+                }
+                Y += bargutter;
+            }
+        }
+        chart.label = function (labels, isRight) {
+            labels = labels || [];
+            this.labels = paper.set();
+            for (var i = 0; i < len; i++) {
+                for (var j = 0; j < multi; j++) {
+                    var  label = paper.labelise(multi ? labels[j] && labels[j][i] : labels[i], multi ? values[j][i] : values[i], total),
+                        X = isRight ? bars[i * (multi || 1) + j].x - barheight / 2 + 3 : x + 5,
+                        A = isRight ? "end" : "start",
+                        L;
+                    this.labels.push(L = paper.text(X, bars[i * (multi || 1) + j].y, label).attr(txtattr).attr({ "text-anchor": A }).insertBefore(covers[0]));
+                    if (L.getBBox().x < x + 5) {
+                        L.attr({x: x + 5, "text-anchor": "start"});
+                    } else {
+                        bars[i * (multi || 1) + j].label = L;
+                    }
+                }
+            }
+            return this;
+        };
+        chart.hover = function (fin, fout) {
+            covers2.hide();
+            covers.show();
+            fout = fout || function () {};
+            covers.mouseover(fin).mouseout(fout);
+            return this;
+        };
+        chart.hoverColumn = function (fin, fout) {
+            covers.hide();
+            covers2.show();
+            fout = fout || function () {};
+            covers2.mouseover(fin).mouseout(fout);
+            return this;
+        };
+        chart.each = function (f) {
+            if (!Raphael.is(f, "function")) {
+                return this;
+            }
+            for (var i = covers.length; i--;) {
+                f.call(covers[i]);
+            }
+            return this;
+        };
+        chart.eachColumn = function (f) {
+            if (!Raphael.is(f, "function")) {
+                return this;
+            }
+            for (var i = covers2.length; i--;) {
+                f.call(covers2[i]);
+            }
+            return this;
+        };
+        chart.click = function (f) {
+            covers2.hide();
+            covers.show();
+            covers.click(f);
+            return this;
+        };
+        chart.clickColumn = function (f) {
+            covers.hide();
+            covers2.show();
+            covers2.click(f);
+            return this;
+        };
+        chart.push(bars, covers, covers2);
+        chart.bars = bars;
+        chart.covers = covers;
+        return chart;
+    };
+    //inheritance
+    var F = function() {};
+    F.prototype = Raphael.g;
+    HBarchart.prototype = VBarchart.prototype = new F;
+    Raphael.fn.hbarchart = function(x, y, width, height, values, opts) {
+        return new HBarchart(this, x, y, width, height, values, opts);
+    };
+    Raphael.fn.barchart = function(x, y, width, height, values, opts) {
+        return new VBarchart(this, x, y, width, height, values, opts);
+    };
+})();