Sto usando Chart JS v.1.0.2. Quando ho una riga e mancano i dati, il suggerimento mostra l'etichetta x.Come disattivare la descrizione comando di Chart JS quando non c'è alcun valore?
Qualcuno sa come disabilitare il suggerimento quando il valore del punto è nullo?
Grazie mille!
Se non ti dispiace un paio di messaggi della console è possibile throw un errore per uscire fuori dal metodo di tooltip per null valori, in questo modo
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;
}
});
L'alternativa sarebbe quella di estendere il grafico o scrivere un tooltip personalizzati funzionano
Fiddle - http://jsfiddle.net/y4zunrx6/
Meglio approccio è quello di CUS Tomize tooltip template per mostrare nessun dato:
tooltipTemplate: "<%if (label && value){%><%=label%>: <%= value %><%} else {%> No data <%}%>"
dove farlo? significa quale file? @Suraj Pai – ephemeral
Volevo disattivare il tooltip tutte le volte. La versione che sto utilizzando è 2.1.6, e l'ho fatto in questo modo:
var options = {
tooltips : {
enabled: false
}
};
Nota: Questo non visualizzerà tool-tip a tutti, usarlo solo quando si desidera disattivare il tool-tip che appare .
Funziona, ma come si disabilitano i suggerimenti per determinate barre? Ad esempio, la prima barra ha un suggerimento, ma il secondo e il terzo non hanno – akashrajkn
@akashrajkn A tale scopo, invece di opzioni (come ho usato sopra), è necessario passare l'opzione per singolo elemento e all'interno di ciascuna, decidere la parametro abilitato per essere vero o falso. –
Questo non risponde alla domanda originale. In che modo ha così tanti voti positivi in questo contesto? – taystack
Utilizzando chart.js 2.3.0 e angolari-chart.js 1.1.1, ho risolto il problema a livello globale, risolvendo il provider ChartJsProvider nella mia funzione angular.module('shared').config(...) e specificando un callback personalizzato label per l'opzione tooltips:
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;
}
}
}
});
Restituendo null la descrizione comando non viene visualizzata per quel tooltipItem specifico.
Riferimento: Chart.js Tooltip Configuration
Grazie per la risposta. Lo proverò. Nel frattempo, vorrei chiedere come un principiante come me impara ad estendere il grafico o personalizzare i suggerimenti? Non sono riuscito a trovare alcuna documentazione facile da capire sul plug-in. – greenTea2Codes
Per personalizzare i tooltip ci sono un paio di file di esempio nel progetto GitHub. per esempio. https://github.com/nnnick/Chart.js/blob/master/samples/line-customTooltips.html. estendere è facile una volta che ci si diletta per un po '. Basta fare un console.log dell'oggetto grafico e avrai una buona idea di quali attributi ci sono ed è chiamato molto bene in modo da avere una buona idea di cosa sia ciascuna proprietà. Il prossimo passo sarà dare un'occhiata a diverse estensioni e guardare il codice della biblioteca (è molto ben organizzato) – potatopeelings
Lanciare un errore non catturato è la risposta più votata? Davvero? –