KendoUI の dataViz ライブラリを使用すると、折れ線グラフ内に表示されるツールチップに子 p タグを持つ div が含まれます。この p タグのコンテンツは動的です。p タグが空の場合、データ ポイントにカーソルを合わせると、段落タグ内のコンテンツの長さをチェックする関数を実行し、空の場合は div を含む全体を非表示にします。マウスがデータポイント上にある間、divが一瞬だけ非表示になり、その後再び表示されるという問題があります。ここに例があります。
編集: 以下は、OnaBai のメソッドを使用してツールチップを実装する方法です。ただし、まだ正しく機能していません。if 条件は、最初のブロックを実行する必要があります。これは、p タグに文字が含まれていない場合です。
tooltip: {
visible: true,
border: {
width: 1
},
font: "10px MS Trebuchet, Arial, sans-serif",
template: function (a) {
if (!$(".tooltip-alert p").text().trim().length) {
return mTypeName + " " + a.value + unitName + " <br/>" +
a.dataItem.measurementtime + " " + a.dataItem.measurementdate + "<br/>" +
"<div class='tooltip-alert'>" +
"<p></p>" +
"</div>";
} else {
return mTypeName + " " + a.value + unitName + " <br/>" +
a.dataItem.measurementtime + " " + a.dataItem.measurementdate + "<br/>" +
"<div class='tooltip-alert'>" +
"<div class='statType-icon alertIcon-" + a.dataItem.alertid + "'></div>" +
"<p>" + a.dataItem.alertname + "</p>" +
"</div>";
}
}
},