d3.chart
Version:
A framework for creating reusable charts with D3.js
53 lines (45 loc) • 2.11 kB
Markdown
- Change configuration from AMD- and CommonJS-enabled environments. d3.chart is
now defined using the Universal Module Definition ("UMD") pattern,
facilitating more natural consumption from projects that are structured
according to the AMD or CommonJS module formats.
- AMD projects should now define an entry to the "paths" configuration for
"d3.chart" (a "shim" configuration is no longer necessary).
- CommonJS projects may now include d3.chart directly via
`require('d3.chart')`.
- No change is required in projects that include `d3.chart` via an HTML
`<script>` tag.
- In all cases, this library will continue to define a new property on the
object exposed by the `d3` module.
### From 0.1 to 0.2
- Update chart definitions:
- Remove all but the first argument to the `initialize` method. (This may
requiring refactoring the first argument to support multiple values via a
generic "options" object.)
- Modify usage of the `Chart#mixin` method:
- Change references to the `Chart#mixin` method to `Chart#attach`.
- Instead of invoking with a Chart constructor name, a d3 selection, and
options for the chart constructor, first instantiate a chart explicitly and
invoke with a unique instance name and the new chart instance.
Example:
```diff
d3.chart('ExampleChart', {
- initialize: function(arg1, arg2) {
+ // If your Chart's `initialize` method has to be changed in this way, don't
+ // forget to also update the usage of the chart.
+ initialize: function(options) {
- this.mixin('OtherChart', this.base.append('g'), {
- exampleAttribute: 'value'
- });
+ // Create the chart explicitly
+ var otherChart = this.base.append('g').chart('OtherChart', {
+ exampleAttribute: 'value'
+ });
+ // Use `Chart#attach` to activate the behavior previously controlled via
+ // `Chart#mixin`--the specified Chart's `draw` method will be
+ // automatically invoked when you call this chart's `draw` method.
+ this.attach('otherChart', otherChart);
}
});
```