vizkit.js is an opinionated little charting library built on top of the amazing and wonderful d3.js visualization framework.
.yaxis({key: value}) / .xaxis({key: value})Configuration method used to specify properties of the chart axis.
| Key Name | Description | Allowed Value |
|---|---|---|
| tickFormat | A number format function suitable for displaying a tick value. | d3 format specifer |
| ticks | The number of ticks this axis should have. | integer |
| scale | Specifies the d3.js scale to use with this axis. see: scales. | 'linear', 'ordinal', or 'time' |
| gridLine | Specifies whether the chart ticks should extend vertically to the axis. | true or false |
.legend({key: value})Configuration method used to specify properties of the chart legend.
| Key Name | Description | Allowed Value |
|---|---|---|
| addMouseoverClasses | Specifies whether css classes should be added to the chart when hovering over a legend symbol. If true, class names are: bar-mo, key-mo, bar-nomo, key-nomo | true or false |
| symbol | symbol used for each bar on the legend. | d3 symbol object |
.tooltip({key: value})Configuration method used to specify properties of chart value tooltips.
| Key Name | Description | Allowed Value |
|---|---|---|
| content | A template string to display in the tooltip. Variables to display in the template between brackets are key, xValue, and yValue. If true, a div with the class name .vizkit-tooltip will be available for styling. | string template like: "<h1>{{key}}:</h1><p>{{xValue}}, {{yValue}}</p>" |