7x31/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2025-10-31 19:39:20 +08:00
Code Issues Packages Projects Releases 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
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,