mirrors/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-11-27 20:10:53 +03:00
Code Issues Projects Releases Packages Wiki Activity

Feat: Use selective import, improve tooltip UI

Browse source
This commit is contained in:
Nelson Chan 2021-08-12 00:31:21 +08:00
parent 71bec74081
commit 6ed1d8cb2f
1 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/components/PingChart.vue
View file

@ -3,7 +3,7 @@
</template>
<script>
import { Chart, registerables } from "chart.js";
import { BarController, BarElement, Chart, Filler, LinearScale, LineController, LineElement, PointElement, TimeScale, Tooltip } from "chart.js";
import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
import timezone from "dayjs/plugin/timezone";
@ -12,7 +12,7 @@ import { LineChart } from "vue-chart-3";
dayjs.extend(utc);
dayjs.extend(timezone);
Chart.register(...registerables);
Chart.register(LineController, BarController, LineElement, PointElement, TimeScale, BarElement, LinearScale, Tooltip, Filler);
export default {
components: { LineChart },
@ -86,9 +86,17 @@ export default {
bounds: "ticks",
plugins: {
tooltip: {
mode: "nearest",
intersect: false,
padding: 10,
filter: function (tooltipItem) {
return tooltipItem.datasetIndex === 0;
},
callbacks: {
label: (context) => {
return ` ${new Intl.NumberFormat().format(context.parsed.y)} ms`
},
}
},
legend: {
display: false,