Use date-fns adapter
This commit is contained in:
parent
d94dd3895e
commit
04032e944c
15
web/package-lock.json
generated
15
web/package-lock.json
generated
|
@ -12,6 +12,7 @@
|
|||
"apollo-link-ws": "^1.0.20",
|
||||
"apollo-utilities": "^1.3.4",
|
||||
"chart.js": "^3.8.0",
|
||||
"chartjs-adapter-date-fns": "^2.0.0",
|
||||
"date-fns": "^2.28.0",
|
||||
"eslint": "^6.8.0",
|
||||
"qrcode.vue": "^1.7.0",
|
||||
|
@ -8796,6 +8797,14 @@
|
|||
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.8.0.tgz",
|
||||
"integrity": "sha512-cr8xhrXjLIXVLOBZPkBZVF6NDeiVIrPLHcMhnON7UufudL+CNeRrD+wpYanswlm8NpudMdrt3CHoLMQMxJhHRg=="
|
||||
},
|
||||
"node_modules/chartjs-adapter-date-fns": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/chartjs-adapter-date-fns/-/chartjs-adapter-date-fns-2.0.0.tgz",
|
||||
"integrity": "sha512-rmZINGLe+9IiiEB0kb57vH3UugAtYw33anRiw5kS2Tu87agpetDDoouquycWc9pRsKtQo5j+vLsYHyr8etAvFw==",
|
||||
"peerDependencies": {
|
||||
"chart.js": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/check-types": {
|
||||
"version": "8.0.3",
|
||||
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
|
||||
|
@ -31294,6 +31303,12 @@
|
|||
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.8.0.tgz",
|
||||
"integrity": "sha512-cr8xhrXjLIXVLOBZPkBZVF6NDeiVIrPLHcMhnON7UufudL+CNeRrD+wpYanswlm8NpudMdrt3CHoLMQMxJhHRg=="
|
||||
},
|
||||
"chartjs-adapter-date-fns": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/chartjs-adapter-date-fns/-/chartjs-adapter-date-fns-2.0.0.tgz",
|
||||
"integrity": "sha512-rmZINGLe+9IiiEB0kb57vH3UugAtYw33anRiw5kS2Tu87agpetDDoouquycWc9pRsKtQo5j+vLsYHyr8etAvFw==",
|
||||
"requires": {}
|
||||
},
|
||||
"check-types": {
|
||||
"version": "8.0.3",
|
||||
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
"apollo-link-ws": "^1.0.20",
|
||||
"apollo-utilities": "^1.3.4",
|
||||
"chart.js": "^3.8.0",
|
||||
"chartjs-adapter-date-fns": "^2.0.0",
|
||||
"date-fns": "^2.28.0",
|
||||
"eslint": "^6.8.0",
|
||||
"qrcode.vue": "^1.7.0",
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
|
||||
<script>
|
||||
import { Line as LineChart } from 'vue-chartjs/legacy'
|
||||
import { time } from '../../plugins/date'
|
||||
import 'chartjs-adapter-date-fns'
|
||||
|
||||
import { Chart as ChartJS, registerables } from 'chart.js'
|
||||
|
||||
|
@ -74,11 +74,18 @@ export default {
|
|||
}
|
||||
},
|
||||
x: {
|
||||
type: 'time',
|
||||
time: {
|
||||
unit: 'minute'
|
||||
unit: 'minute',
|
||||
stepSize: 15,
|
||||
|
||||
displayFormats: {
|
||||
minute: 'HH:mm'
|
||||
}
|
||||
},
|
||||
|
||||
title: {
|
||||
display: true,
|
||||
display: false,
|
||||
text: 'Data'
|
||||
}
|
||||
}
|
||||
|
@ -92,9 +99,7 @@ export default {
|
|||
const tension = 0.1
|
||||
|
||||
return {
|
||||
labels: this.stats.map(stat =>
|
||||
time(new Date(stat.timestamp).getTime())
|
||||
),
|
||||
labels: this.stats.map(stat => new Date(stat.timestamp).getTime()),
|
||||
datasets: [
|
||||
{
|
||||
label: 'Clientes conectados',
|
||||
|
|
|
@ -18,26 +18,10 @@
|
|||
import { Line as LineChart } from 'vue-chartjs/legacy'
|
||||
import { time } from '../../plugins/date'
|
||||
|
||||
import {
|
||||
Chart as ChartJS,
|
||||
Title,
|
||||
Tooltip,
|
||||
Legend,
|
||||
LineElement,
|
||||
LinearScale,
|
||||
CategoryScale,
|
||||
PointElement
|
||||
} from 'chart.js'
|
||||
import { Chart as ChartJS, registerables } from 'chart.js'
|
||||
import 'chartjs-adapter-date-fns'
|
||||
|
||||
ChartJS.register(
|
||||
Title,
|
||||
Tooltip,
|
||||
Legend,
|
||||
LineElement,
|
||||
LinearScale,
|
||||
CategoryScale,
|
||||
PointElement
|
||||
)
|
||||
ChartJS.register(...registerables)
|
||||
|
||||
export default {
|
||||
components: { LineChart },
|
||||
|
@ -89,6 +73,22 @@ export default {
|
|||
display: true,
|
||||
text: 'dBm'
|
||||
}
|
||||
},
|
||||
x: {
|
||||
type: 'time',
|
||||
time: {
|
||||
unit: 'minute',
|
||||
stepSize: 15,
|
||||
|
||||
displayFormats: {
|
||||
minute: 'HH:mm'
|
||||
}
|
||||
},
|
||||
|
||||
title: {
|
||||
display: false,
|
||||
text: 'Data'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -100,7 +100,7 @@ export default {
|
|||
const tension = 0.2
|
||||
|
||||
return {
|
||||
labels: this.stats.map(stat => time(stat.timestamp)),
|
||||
labels: this.stats.map(stat => new Date(stat.timestamp).getTime()),
|
||||
|
||||
datasets: [
|
||||
{
|
||||
|
|
Loading…
Reference in New Issue
Block a user