Javascript 保存显示所有工具提示的图表

Javascript 保存显示所有工具提示的图表,javascript,jquery,charts,download,chart.js,Javascript,Jquery,Charts,Download,Chart.js,我在保存包含工具提示的ChartJS图表时遇到问题(应该一起显示)。当我保存图表(右键单击->另存为/画布)时,我得到了没有工具提示的图表。如何下载包含工具提示的图表?我在文档中找不到任何提示或想法 非常感谢。我自己找到了解决方案 我使用了以下插件: Chart.pluginService.register({ beforeRender: function (chart) { if (chart.config.options.showAllTooltips) { //

我在保存包含工具提示的ChartJS图表时遇到问题(应该一起显示)。当我保存图表(右键单击->另存为/画布)时,我得到了没有工具提示的图表。如何下载包含工具提示的图表?我在文档中找不到任何提示或想法


非常感谢。

我自己找到了解决方案

我使用了以下插件:

Chart.pluginService.register({
  beforeRender: function (chart) {
    if (chart.config.options.showAllTooltips) {
        // create an array of tooltips
        // we can't use the chart tooltip because there is only one tooltip per chart
        chart.pluginTooltips = [];
        chart.config.data.datasets.forEach(function (dataset, i) {
            chart.getDatasetMeta(i).data.forEach(function (sector, j) {
                chart.pluginTooltips.push(new Chart.Tooltip({
                    _chart: chart.chart,
                    _chartInstance: chart,
                    _data: chart.data,
                    _options: chart.options.tooltips,
                    _active: [sector]
                }, chart));
            });
        });

        // turn off normal tooltips
        chart.options.tooltips.enabled = false;
    }
},
  afterDraw: function (chart, easing) {
    if (chart.config.options.showAllTooltips) {
        // we don't want the permanent tooltips to animate, so don't do anything till the animation runs atleast once
        if (!chart.allTooltipsOnce) {
            if (easing !== 1)
                return;
            chart.allTooltipsOnce = true;
        }

        // turn on tooltips
        chart.options.tooltips.enabled = true;
        Chart.helpers.each(chart.pluginTooltips, function (tooltip) {
            tooltip.initialize();
            tooltip.update();
            // we don't actually need this since we are not animating tooltips
            tooltip.pivot();
            tooltip.transition(easing).draw();
        });
        chart.options.tooltips.enabled = false;
    }
  }
});
此外,我还使用以下自定义功能打开所有工具提示,下载图表并再次关闭所有工具提示:

function downloadChart1() {
    chart1.options.showAllTooltips = true;
    chart1.update(0, false);
    var returnString = $("#chart1")[0].toDataURL('image/png').replace("image/png", "image/octet-stream");
    $("#downloadChartPng1")[0].setAttribute("href", returnString);
    chart1.options.showAllTooltips = false;
    chart1.options.tooltips.enabled = true;
    chart1.update(0, false);
}
然后,我仅使用以下链接下载图表:

<a id="downloadChartPng1"
onClick="downloadChart1()"
title="picture"
download="chart_name.png">