Mirrors/Chart.js
2
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2026-03-13 03:36:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

improve line-customTooltips sample

Browse Source 
- set title for chart
- set same size canvas as other samples
- remove user select from canvas
- remove logs
This commit is contained in:
Ville Hämäläinen
2016-02-28 07:34:37 +02:00
parent 4729b05cc1
commit dae599e16d
1 changed files with 10 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
samples/line-customTooltips.html
View File

@@ -6,16 +6,11 @@
<script src="../dist/Chart.bundle.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<style>
#canvas-holder1 {
width: 300px;
margin: 20px auto;
canvas{
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
#canvas-holder2 {
width: 50%;
margin: 20px 25%;
}
#chartjs-tooltip {
opacity: 1;
position: absolute;
@@ -38,16 +33,14 @@
</head>
<body>
<div id="canvas-holder1">
<canvas id="chart1" width="300" height="100" />
<div id="canvas-holder1" style="width:75%;">
<canvas id="chart1"/>
</div>
<script>
window.count = 0;
Chart.defaults.global.pointHitDetectionRadius = 1;
var customTooltips = function(tooltip) {
console.log(window.count++, tooltip);
// Tooltip Element
var tooltipEl = $('#chartjs-tooltip');
@@ -131,6 +124,10 @@
type: 'line',
data: lineChartData,
options: {
title:{
display:true,
text:'Chart.js Line Chart - Custom Tooltips'
},
tooltips: {
enabled: false,
custom: customTooltips