diff --git a/src/BaseCharts/Bar.js b/src/BaseCharts/Bar.js index a52fd57b..41a0df66 100644 --- a/src/BaseCharts/Bar.js +++ b/src/BaseCharts/Bar.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -52,25 +51,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - scales: { - yAxes: [{ - ticks: { - beginAtZero: true - }, - gridLines: { - display: false - } - }], - xAxes: [ { - gridLines: { - display: false - }, - categoryPercentage: 0.5, - barPercentage: 0.2 - }] - } - }, _plugins: this.plugins } }, @@ -80,12 +60,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'bar', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/Bubble.js b/src/BaseCharts/Bubble.js index 14df228a..af104a77 100644 --- a/src/BaseCharts/Bubble.js +++ b/src/BaseCharts/Bubble.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,25 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - scales: { - yAxes: [{ - ticks: { - beginAtZero: true - }, - gridLines: { - display: false - } - }], - xAxes: [ { - gridLines: { - display: false - }, - categoryPercentage: 0.5, - barPercentage: 0.2 - }] - } - }, _plugins: this.plugins } }, @@ -82,13 +62,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) - this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'bubble', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/Doughnut.js b/src/BaseCharts/Doughnut.js index aaab9c79..d106f907 100644 --- a/src/BaseCharts/Doughnut.js +++ b/src/BaseCharts/Doughnut.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,8 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - }, _plugins: this.plugins } }, @@ -64,14 +61,13 @@ export default { addPlugin (plugin) { this.$data._plugins.push(plugin) }, - renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) + renderChart (data, options) { this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'doughnut', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/HorizontalBar.js b/src/BaseCharts/HorizontalBar.js index b9e57d58..af07d880 100644 --- a/src/BaseCharts/HorizontalBar.js +++ b/src/BaseCharts/HorizontalBar.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,25 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - scales: { - yAxes: [{ - ticks: { - beginAtZero: true - }, - gridLines: { - display: false - } - }], - xAxes: [ { - gridLines: { - display: false - }, - categoryPercentage: 0.5, - barPercentage: 0.2 - }] - } - }, _plugins: this.plugins } }, @@ -81,13 +61,12 @@ export default { addPlugin (plugin) { this.$data._plugins.push(plugin) }, - renderChart (data, options, type) { - let chartOptions = mergeOptions(this.defaultOptions, options) + renderChart (data, options) { this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'horizontalBar', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/Line.js b/src/BaseCharts/Line.js index 3daa6591..883a4350 100644 --- a/src/BaseCharts/Line.js +++ b/src/BaseCharts/Line.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,23 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - scales: { - yAxes: [{ - ticks: { - beginAtZero: true - }, - gridLines: { - display: false - } - }], - xAxes: [ { - gridLines: { - display: false - } - }] - } - }, _plugins: this.plugins } }, @@ -80,13 +62,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) - this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'line', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/Pie.js b/src/BaseCharts/Pie.js index 99d7a4f0..e6c61443 100644 --- a/src/BaseCharts/Pie.js +++ b/src/BaseCharts/Pie.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,8 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - }, _plugins: this.plugins } }, @@ -65,13 +62,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) - this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'pie', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/PolarArea.js b/src/BaseCharts/PolarArea.js index f33b6823..241e2229 100644 --- a/src/BaseCharts/PolarArea.js +++ b/src/BaseCharts/PolarArea.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,8 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - }, _plugins: this.plugins } }, @@ -65,13 +62,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) - this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'polarArea', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/Radar.js b/src/BaseCharts/Radar.js index e6acd914..ed62e257 100644 --- a/src/BaseCharts/Radar.js +++ b/src/BaseCharts/Radar.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,8 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - }, _plugins: this.plugins } }, @@ -65,13 +62,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) - this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'radar', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/BaseCharts/Scatter.js b/src/BaseCharts/Scatter.js index e29e0cb0..b1b099e8 100644 --- a/src/BaseCharts/Scatter.js +++ b/src/BaseCharts/Scatter.js @@ -1,5 +1,4 @@ import Chart from 'chart.js' -import { mergeOptions } from '../helpers/options' export default { render: function (createElement) { @@ -54,14 +53,6 @@ export default { data () { return { _chart: null, - defaultOptions: { - scales: { - xAxes: [{ - type: 'linear', - position: 'bottom' - }] - } - }, _plugins: this.plugins } }, @@ -71,13 +62,11 @@ export default { this.$data._plugins.push(plugin) }, renderChart (data, options) { - let chartOptions = mergeOptions(this.defaultOptions, options) - this.$data._chart = new Chart( this.$refs.canvas.getContext('2d'), { type: 'scatter', data: data, - options: chartOptions, + options: options, plugins: this.$data._plugins } ) diff --git a/src/examples/App.vue b/src/examples/App.vue index a7da41eb..1107e632 100644 --- a/src/examples/App.vue +++ b/src/examples/App.vue @@ -5,6 +5,11 @@ +
+

Horizontal Barchart

+ +
+

Barchart with reactive mixing for live data

@@ -63,6 +68,7 @@ import ReactiveExample from './ReactiveExample' import ReactivePropExample from './ReactivePropExample' import ScatterExample from './ScatterExample' + import HorizontalBarExample from './HorizontalBarExample' export default { components: { @@ -75,7 +81,8 @@ BubbleExample, ReactiveExample, ReactivePropExample, - ScatterExample + ScatterExample, + HorizontalBarExample }, data () { return { diff --git a/src/helpers/options.js b/src/helpers/options.js deleted file mode 100644 index ccae2338..00000000 --- a/src/helpers/options.js +++ /dev/null @@ -1,5 +0,0 @@ -import merge from 'lodash.merge' - -export function mergeOptions (obj, src) { - return merge(obj, src) -} diff --git a/test/unit/specs/helpers/options.spec.js b/test/unit/specs/helpers/options.spec.js deleted file mode 100644 index 8e2f90e3..00000000 --- a/test/unit/specs/helpers/options.spec.js +++ /dev/null @@ -1,54 +0,0 @@ -import { mergeOptions } from '@/helpers/options' - -describe('mergeOptions.js', () => { - const a = { - a: 'a', - b: 'a' - } - - const b = { - a: 'b', - b: 'b' - } - - const c = { - c: 'c' - } - - const an = { - a: { - a: 'a' - }, - b: { - b: 'a' - } - } - - const bn = { - a: { - a: 'a' - }, - b: { - b: 'b' - } - } - - it('should replace old a and b if a and b are new', () => { - const ab = mergeOptions(a, b) - expect(ab).to.have.property('a').and.to.equal('b') - expect(ab).to.have.property('b').and.to.equal('b') - }) - - it('should add c if c is new', () => { - const ac = mergeOptions(a, c) - expect(ac).to.have.property('a').and.to.equal('b') - expect(ac).to.have.property('b').and.to.equal('b') - expect(ac).to.have.property('c').and.to.equal('c') - }) - - it('should replace old a and b if a and b are new in nested objects', () => { - const ab = mergeOptions(an, bn) - expect(ab).to.have.deep.property('a.a').and.to.equal('a') - expect(ab).to.have.deep.property('b.b').and.to.equal('b') - }) -}) diff --git a/test/unit/specs/mixins/reactiveData.js b/test/unit/specs/mixins/reactiveData.js deleted file mode 100644 index e69de29b..00000000