Browse files

add docs for custom scales

  • Loading branch information...
1 parent d9db176 commit 9ad245d6fd055dc43eadf68ff27449f3ea9c2b82 @paularmstrong paularmstrong committed Aug 8, 2013
Showing with 39 additions and 1 deletion.
  1. +1 −1 docs.json
  2. +38 −0 docs/docs.html
View
2 docs.json
@@ -1,3 +1,3 @@
{
- "version": "v0.2.0"
+ "version": "v0.3.0"
}
View
38 docs/docs.html
@@ -103,6 +103,41 @@
<hr>
+ <article id="scales" class="doc">
+ <h1>Custom Scales</h1>
+
+ <p>By default, xCharts includes four scale types: <i>ordinal</i>, <i>linear</i>, <i>time</i>, and <i>exponential</i>. However, you can create custom scale types very easily.</p>
+
+ <pre><code data-language="js">function myScale(data, axis, bounds, extents) {
+ return d3.scale.linear()
+ .domain(extents)
+ .nice()
+ .rangeRound(bounds);
+}
+xChart.setScale('scale-name', myScale);</code></pre>
+
+ <h2>Arguments</h2>
+ <dl>
+ <dt><var>data</var></dt>
+ <dd><code data-language="js">object</code></dd>
+ <dd>Merged set of all data that will be displayed on the chart.</dd>
+
+ <dt><var>axis</var></dt>
+ <dd><code data-language="js">string</code></dd>
+ <dd>Either <samp>x</samp> or <samp>y</samp>.</dd>
+
+ <dt><var>bounds</var></dt>
+ <dd><code data-language="js">array</code></dd>
+ <dd>Min and max screen position values for the given axis.</dd>
+
+ <dt><var>extents</var></dt>
+ <dd><code data-language="js">array</code></dd>
+ <dd>Min and max values for the <var>data</var>.</dd>
+ </dl>
+ </article>
+
+ <hr>
+
<article id="styles" class="doc">
<h1>Styling Your Chart</h1>
@@ -216,6 +251,9 @@
</ol>
</li>
<li>
+ <a href="#scales">Custom Scales</a>
+ </li>
+ <li>
<a href="#styles">Styling Your Chart</a>
</li>
<li>

0 comments on commit 9ad245d

Please sign in to comment.