Ich verwende Chart JS v.1.0.2. Wenn eine Zeile fehlt und Daten fehlen, zeigt der Tooltip x-label an.Wie deaktiviert man Chart JS Tooltip, wenn es keinen Wert gibt?
Kann jemand den Tooltip deaktivieren, wenn der Punktwert null ist?
Vielen Dank!
Wenn Sie nicht über ein paar Konsolnachrichten dagegen einen Fehler throw kann, wie so null Werte für die Tooltip-Methode auszutreten
var myLineChart = new Chart(ctx).Line(data, {
tooltipTemplate: function (d) {
if (d.value === null)
throw '';
else
// else return the normal tooltip text
return d.label + ': ' + d.value;
}
});
Die Alternative wäre, um das Diagramm zu erweitern oder ein schreiben benutzerdefinierte Tooltips funktionieren
Fiddle - http://jsfiddle.net/y4zunrx6/
bessere Ansatz ist es, cus tomize Tooltip-Vorlage, um keine Daten anzuzeigen:
tooltipTemplate: "<%if (label && value){%><%=label%>: <%= value %><%} else {%> No data <%}%>"
wo das zu tun? meine welche Datei? @Suraj Pai – ephemeral
Ich wollte den Tooltip alle Male deaktivieren. Die Version Ich verwende ist 2.1.6, und ich habe es wie folgt aus:
var options = {
tooltips : {
enabled: false
}
};
Hinweis: Dies wird nicht Tool-Tip überhaupt angezeigt werden, verwenden Sie es nur, wenn Sie die Tool-Tip deaktivieren möchten erscheinen .
Das funktioniert, aber wie deaktivierst du Tooltips für bestimmte Bars? Zum Beispiel hat der erste Balken einen Tooltip, aber der zweite und der dritte haben keine – akashrajkn
@akashrajkn Zu diesem Zweck müssen Sie anstelle von Optionen (wie ich oben verwendet habe) Option für einzelnes Element übergeben und in jedem, entscheiden Sie die Parameter aktiviert, um wahr oder falsch zu sein. –
Dies beantwortet die ursprüngliche Frage nicht. Wie hat es in diesem Zusammenhang so viele Stimmen? – taystack
Mit chart.js 2.3.0 und Winkel chart.js 1.1.1, löste ich das Problem global durch die Lösung des ChartJsProvider Anbieters in meiner angular.module('shared').config(...) Funktion und einen benutzerdefinierten label Rückruf für die tooltips Option angeben:
ChartJsProvider.setOptions({
tooltips: {
enabled: true,
//mode: 'single',
callbacks: {
label: function (tooltipItem, data) {
const tooltip = data.datasets[tooltipItem.datasetIndex];
const value = tooltip.data[tooltipItem.index];
return value === 0 ? null : tooltip.label + ': ' + value;
}
}
}
});
Durch die Rückgabe von null wird der Tooltip für dieses spezifische TooltipItem nicht angezeigt.
Referenz: Chart.js Tooltip Configuration
Vielen Dank für Ihre Antwort. Ich werde es versuchen. In der Zwischenzeit möchte ich fragen, wie lernt ein Anfänger wie ich, die Karte zu erweitern oder die Tooltips anzupassen? Ich konnte keine leicht verständliche Dokumentation über das Plugin finden. – greenTea2Codes
Zum Anpassen von Tooltips gibt es ein paar Beispieldateien im GitHub-Projekt. z.B. https://github.com/nnnick/Chart.js/blob/master/samples/line-customTooltips.html. Das Ausstrecken ist einfach, wenn man es ein wenig in die Hand nimmt. Machen Sie einfach eine console.log des Diagrammobjekts, und Sie erhalten eine genaue Vorstellung davon, welche Attribute vorhanden sind und es ist sehr gut benannt, so dass Sie eine ungefähre Vorstellung davon bekommen, was jede Eigenschaft ist. Der nächste Schritt wäre, einen Blick auf verschiedene Erweiterungen zu werfen und den Bibliothekscode anzuschauen (er ist sehr gut organisiert). – potatopeelings
Einen unbegangenen Fehler zu werfen ist die beste Wahl? Wirklich? –