ABPCMS.Web/lib/chart.js/samples/tooltips/border.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!doctype html>
<html>

<head>
	<title>Tooltip Border</title>
	<script src="../../dist/Chart.bundle.js"></script>
	<script src="../utils.js"></script>
	<style>
	canvas {
		-moz-user-select: none;
		-webkit-user-select: none;
		-ms-user-select: none;
	}
	.chart-container {
		width: 70%;
		margin-left: 40px;
		margin-right: 40px;
		margin-bottom: 40px;
	}
	.container {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
	}
	</style>
</head>

<body>
	<div class="container">
	</div>
	<script>
		function createConfig() {
			return {
				type: 'line',
				data: {
					labels: ["January", "February", "March", "April", "May", "June", "July"],
					datasets: [{
						label: "Dataset",
						borderColor: window.chartColors.red,
						backgroundColor: window.chartColors.red,
						data: [10, 30, 46, 2, 8, 50, 0],
						fill: false,
					}]
				},
				options: {
					responsive: true,
					title:{
						display: true,
						text: 'Sample tooltip with border'
					},
					tooltips: {
						position: 'nearest',
						mode: 'index',
						intersect: false,
						yPadding: 10,
						xPadding: 10,
						caretSize: 8,
						backgroundColor: 'rgba(72, 241, 12, 1)',
						titleFontColor: window.chartColors.black,