mirror of
https://github.com/KevinMidboe/vue-chartjs.git
synced 2025-10-29 18:00:20 +00:00
Compare commits
8 Commits
release/1.
...
v1.2.0
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
4f5aa1811d | ||
|
|
098c90edf1 | ||
|
|
3f15eb9abc | ||
|
|
68e94b7fe3 | ||
|
|
0d24270bf2 | ||
|
|
e034467e5b | ||
|
|
c7cb8e24e9 | ||
|
|
4c9f4fc5e5 |
2
.gitignore
vendored
2
.gitignore
vendored
@@ -4,3 +4,5 @@ npm-debug.log
|
|||||||
selenium-debug.log
|
selenium-debug.log
|
||||||
test/unit/coverage
|
test/unit/coverage
|
||||||
test/e2e/reports
|
test/e2e/reports
|
||||||
|
dist/
|
||||||
|
es/
|
||||||
|
|||||||
21
dist/vue-chartjs.js
vendored
21
dist/vue-chartjs.js
vendored
File diff suppressed because one or more lines are too long
1
dist/vue-chartjs.js.map
vendored
1
dist/vue-chartjs.js.map
vendored
File diff suppressed because one or more lines are too long
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "vue-chartjs",
|
"name": "vue-chartjs",
|
||||||
"version": "1.1.5",
|
"version": "1.2.0",
|
||||||
"description": "Vue wrapper for chart.js",
|
"description": "Vue wrapper for chart.js",
|
||||||
"author": "Jakub Juszczak <jakub@nextindex.de>",
|
"author": "Jakub Juszczak <jakub@nextindex.de>",
|
||||||
"repository": {
|
"repository": {
|
||||||
@@ -29,7 +29,7 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"babel-runtime": "^6.0.0",
|
"babel-runtime": "^6.0.0",
|
||||||
"chart.js": "^2.5.0",
|
"chart.js": "^2.6.0",
|
||||||
"vue": "^1.0.21"
|
"vue": "^1.0.21"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|||||||
@@ -63,6 +63,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -46,6 +46,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -46,6 +46,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -61,6 +61,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -46,6 +46,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -46,6 +46,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -46,6 +46,8 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
this._chart.destroy()
|
this._chart.destroy()
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
59
src/BaseCharts/Scatter.js
Normal file
59
src/BaseCharts/Scatter.js
Normal file
@@ -0,0 +1,59 @@
|
|||||||
|
import Vue from 'vue'
|
||||||
|
import Chart from 'chart.js'
|
||||||
|
import { mergeOptions } from '../helpers/options'
|
||||||
|
|
||||||
|
export default Vue.extend({
|
||||||
|
template: `
|
||||||
|
<div>
|
||||||
|
<canvas id="{{chartId}}" width={{width}} height={{height}} v-el:canvas></canvas>
|
||||||
|
</div>
|
||||||
|
`,
|
||||||
|
|
||||||
|
props: {
|
||||||
|
chartId: {
|
||||||
|
default: 'scatter-chart',
|
||||||
|
type: String
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
default: 400,
|
||||||
|
type: Number
|
||||||
|
},
|
||||||
|
height: {
|
||||||
|
default: 400,
|
||||||
|
type: Number
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
defaultOptions: {
|
||||||
|
scales: {
|
||||||
|
xAxes: [{
|
||||||
|
type: 'linear',
|
||||||
|
position: 'bottom'
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
render (data, options) {
|
||||||
|
let chartOptions = mergeOptions(this.defaultOptions, options)
|
||||||
|
|
||||||
|
this._chart = new Chart(
|
||||||
|
this.$els.canvas.getContext('2d'), {
|
||||||
|
type: 'scatter',
|
||||||
|
data: data,
|
||||||
|
options: chartOptions
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this._chart.generateLegend()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
beforeDestroy () {
|
||||||
|
if (this._chart) {
|
||||||
|
this._chart.destroy()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -5,6 +5,7 @@ import Pie from './BaseCharts/Pie'
|
|||||||
import PolarArea from './BaseCharts/PolarArea'
|
import PolarArea from './BaseCharts/PolarArea'
|
||||||
import Radar from './BaseCharts/Radar'
|
import Radar from './BaseCharts/Radar'
|
||||||
import Bubble from './BaseCharts/Bubble'
|
import Bubble from './BaseCharts/Bubble'
|
||||||
|
import Scatter from './BaseCharts/Scatter'
|
||||||
|
|
||||||
const VueCharts = {
|
const VueCharts = {
|
||||||
Bar,
|
Bar,
|
||||||
@@ -13,7 +14,8 @@ const VueCharts = {
|
|||||||
Pie,
|
Pie,
|
||||||
PolarArea,
|
PolarArea,
|
||||||
Radar,
|
Radar,
|
||||||
Bubble
|
Bubble,
|
||||||
|
Scatter
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = VueCharts
|
module.exports = VueCharts
|
||||||
|
|||||||
10
yarn.lock
10
yarn.lock
@@ -1072,11 +1072,11 @@ change-case@3.0.x:
|
|||||||
upper-case "^1.1.1"
|
upper-case "^1.1.1"
|
||||||
upper-case-first "^1.1.0"
|
upper-case-first "^1.1.0"
|
||||||
|
|
||||||
chart.js@^2.5.0:
|
chart.js@^2.6.0:
|
||||||
version "2.5.0"
|
version "2.6.0"
|
||||||
resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.5.0.tgz#fe6e751a893769f56e72bee5ad91207e1c592957"
|
resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.6.0.tgz#308f9a4b0bfed5a154c14f5deb1d9470d22abe71"
|
||||||
dependencies:
|
dependencies:
|
||||||
chartjs-color "^2.0.0"
|
chartjs-color "^2.1.0"
|
||||||
moment "^2.10.6"
|
moment "^2.10.6"
|
||||||
|
|
||||||
chartjs-color-string@^0.4.0:
|
chartjs-color-string@^0.4.0:
|
||||||
@@ -1085,7 +1085,7 @@ chartjs-color-string@^0.4.0:
|
|||||||
dependencies:
|
dependencies:
|
||||||
color-name "^1.0.0"
|
color-name "^1.0.0"
|
||||||
|
|
||||||
chartjs-color@^2.0.0:
|
chartjs-color@^2.1.0:
|
||||||
version "2.1.0"
|
version "2.1.0"
|
||||||
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.1.0.tgz#9c39ac830ccd98996ae80c9f11086ff12c98a756"
|
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.1.0.tgz#9c39ac830ccd98996ae80c9f11086ff12c98a756"
|
||||||
dependencies:
|
dependencies:
|
||||||
|
|||||||
Reference in New Issue
Block a user