mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 04:09:08 +02:00
externalTooltips now labeled customTooltips
This commit is contained in:
parent
8c1e9588a1
commit
64de3eb711
@ -132,8 +132,8 @@ Chart.defaults.global = {
|
||||
// Boolean - Determines whether to draw tooltips on the canvas or not
|
||||
showTooltips: true,
|
||||
|
||||
// Function - Determines whether to execute the externalTooltips function instead of drawing the built in tooltips (See [Advanced - External Tooltips](#advanced-usage-external-tooltips))
|
||||
externalTooltips: false,
|
||||
// Function - Determines whether to execute the customTooltips function instead of drawing the built in tooltips (See [Advanced - External Tooltips](#advanced-usage-custom-tooltips))
|
||||
customTooltips: false,
|
||||
|
||||
// Array - Array of string names to attach tooltip events
|
||||
tooltipEvents: ["mousemove", "touchstart", "touchmove"],
|
||||
|
@ -72,11 +72,11 @@ myLineChart.generateLegend();
|
||||
|
||||
### External Tooltips
|
||||
|
||||
You can enable external tooltips in the global or chart configuration like so:
|
||||
You can enable custom tooltips in the global or chart configuration like so:
|
||||
|
||||
```javascript
|
||||
var myPieChart = new Chart(ctx).Pie(data, {
|
||||
externalTooltips: function(tooltip) {
|
||||
customTooltips: function(tooltip) {
|
||||
|
||||
// tooltip will be false if tooltip is not visible or should be hidden
|
||||
if (!tooltip) {
|
||||
@ -100,7 +100,7 @@ var myPieChart = new Chart(ctx).Pie(data, {
|
||||
});
|
||||
```
|
||||
|
||||
See files `sample/pie-externalTooltips.html` and `sample/line-externalTooltips.html` for examples on how to get started.
|
||||
See files `sample/pie-customTooltips.html` and `sample/line-customTooltips.html` for examples on how to get started.
|
||||
|
||||
|
||||
### Writing new chart types
|
||||
|
@ -50,7 +50,7 @@
|
||||
<script>
|
||||
|
||||
Chart.defaults.global.pointHitDetectionRadius = 1;
|
||||
Chart.defaults.global.externalTooltips = function(tooltip) {
|
||||
Chart.defaults.global.customTooltips = function(tooltip) {
|
||||
|
||||
var tooltipEl = $('#chartjs-tooltip');
|
||||
|
@ -77,7 +77,7 @@
|
||||
|
||||
|
||||
<script>
|
||||
Chart.defaults.global.externalTooltips = function(tooltip) {
|
||||
Chart.defaults.global.customTooltips = function(tooltip) {
|
||||
|
||||
// Tooltip Element
|
||||
var tooltipEl = $('#chartjs-tooltip');
|
@ -99,7 +99,7 @@
|
||||
showTooltips: true,
|
||||
|
||||
// Boolean - Determines whether to draw built-in tooltip or call custom tooltip function
|
||||
externalTooltips: false,
|
||||
customTooltips: false,
|
||||
|
||||
// Array - Array of string names to attach tooltip events
|
||||
tooltipEvents: ["mousemove", "touchstart", "touchmove", "mouseout"],
|
||||
@ -898,8 +898,8 @@
|
||||
this.activeElements = ChartElements;
|
||||
}
|
||||
this.draw();
|
||||
if(this.options.externalTooltips){
|
||||
this.options.externalTooltips(false);
|
||||
if(this.options.customTooltips){
|
||||
this.options.customTooltips(false);
|
||||
}
|
||||
if (ChartElements.length > 0){
|
||||
// If we have multiple datasets, show a MultiTooltip for all of the data points at that index
|
||||
@ -982,7 +982,7 @@
|
||||
title: ChartElements[0].label,
|
||||
chart: this.chart,
|
||||
ctx: this.chart.ctx,
|
||||
external: this.options.externalTooltips
|
||||
custom: this.options.customTooltips
|
||||
}).draw();
|
||||
|
||||
} else {
|
||||
@ -1002,7 +1002,7 @@
|
||||
cornerRadius: this.options.tooltipCornerRadius,
|
||||
text: template(this.options.tooltipTemplate, Element),
|
||||
chart: this.chart,
|
||||
external: this.options.externalTooltips
|
||||
custom: this.options.customTooltips
|
||||
}).draw();
|
||||
}, this);
|
||||
}
|
||||
@ -1281,8 +1281,8 @@
|
||||
ctx.fillStyle = this.fillColor;
|
||||
|
||||
// Custom Tooltips
|
||||
if(this.external){
|
||||
this.external(this);
|
||||
if(this.custom){
|
||||
this.custom(this);
|
||||
}
|
||||
else{
|
||||
switch(this.yAlign)
|
||||
@ -1381,8 +1381,8 @@
|
||||
},
|
||||
draw : function(){
|
||||
// Custom Tooltips
|
||||
if(this.external){
|
||||
this.external(this);
|
||||
if(this.custom){
|
||||
this.custom(this);
|
||||
}
|
||||
else{
|
||||
drawRoundedRectangle(this.ctx,this.x,this.y - this.height/2,this.width,this.height,this.cornerRadius);
|
||||
|
Loading…
Reference in New Issue
Block a user