Question

我想显示文字“January”，然后显示工具提示中的日期。

我该怎么办？不知道怎么做。

https://jsfiddle.net/bfn5u9go/

var data = {
    labels: ["1", "2", "3", "4", "5", "6", "7"],
    datasets: [{
        label: "My First dataset",
        fillColor: "rgba(220,220,220,0.2)",
        strokeColor: "rgba(220,220,220,1)",
        pointColor: "rgba(220,220,220,1)",
        pointStrokeColor: "#fff",
        pointHighlightFill: "#fff",
        pointHighlightStroke: "rgba(220,220,220,1)",
        data: [65, 59, 80, 81, 56, 55, 40]
    }, {
        label: "My Second dataset",
        fillColor: "rgba(151,187,205,0.2)",
        strokeColor: "rgba(151,187,205,1)",
        pointColor: "rgba(151,187,205,1)",
        pointStrokeColor: "#fff",
        pointHighlightFill: "#fff",
        pointHighlightStroke: "rgba(151,187,205,1)",
        data: [28, 48, 40, 19, 86, 27, 90]
    }]
};

window.onload = function () {
    var ctx = document.getElementById("canvas").getContext("2d");
    window.myLine = new Chart(ctx).Line(data, {
        responsive: true
    });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js"></script>

<div style="width:500px;">
    <div>
        <canvas id="canvas"></canvas>
    </div>
</div>

Answer 1

您应该使用 tooltipTemplate 选项：

var options = {
    // String - Template string for single tooltips
    tooltipTemplate: "<%= label %> January: <%= value %>"
};

window.myLine = new Chart(ctx).Line(data, options);

以下是示例：https://jsfiddle.net/wckfhrsa/7/

另外，请检查更多工具提示选项global chart configuration

在工具提示中显示月份名称

1 个答案: