CKeditor4 4.8+Chart1.02图表问题求助：Y轴非零起始、饼图无图例及tooltip

Hey there, I’ve dealt with similar quirks using older versions of the CKEditor Chart plugin, so let’s walk through some practical fixes to get your pie/doughnut chart legends and tooltips working:

1. Force Enable Legend & Tooltip via CKEditor Config #

The Chart 1.02 plugin (built on early Highcharts) might have legends/tooltips disabled by default for pie/doughnut types. Add this to your CKEditor config.js to explicitly turn them on:

CKEDITOR.config.chart_config = {
    pie: {
        legend: { 
            enabled: true,
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle'
        },
        tooltip: {
            enabled: true,
            formatter: function() {
                return `<b>${this.point.name}</b>: ${this.y}`;
            }
        }
    },
    doughnut: {
        legend: { enabled: true },
        tooltip: {
            enabled: true,
            pointFormat: '{point.name}: <b>{point.y}</b>'
        }
    }
};

This overrides the plugin’s default settings for those chart types.

2. Patch the Plugin’s Template Files #

Older versions of the Chart plugin sometimes omit legend/tooltip config in their pie/doughnut templates. Locate the plugin’s template file (usually at plugins/chart/templates/chart.html) and update the pie/doughnut configuration blocks to include:

// Inside the pie chart config section
legend: {
    layout: 'vertical',
    align: 'right',
    verticalAlign: 'middle'
},
tooltip: {
    formatter: function() {
        return '<b>' + this.point.name + '</b>: ' + this.y;
    }
}

Save the file, clear your browser cache, and test again.

3. Resolve Highcharts Version Conflicts #

Chart 1.02 relies on a specific version of Highcharts. If your page loads a different Highcharts version elsewhere, it can break plugin functionality. Ensure:

• You’re using the Highcharts version bundled with the Chart plugin (don’t load an external version)
• Check for console errors related to Highcharts method mismatches (F12 → Console tab)

4. Manually Fix Generated Chart Code #

If all else fails, switch to CKEditor’s Source mode after inserting the chart, and add the legend/tooltip config directly to the Highcharts initialization code:

Highcharts.chart('your-chart-container', {
    chart: { type: 'pie' },
    // Add these lines
    legend: { enabled: true },
    tooltip: { enabled: true },
    series: [{
        data: [
            { name: 'abc', y: 10 },
            { name: 'def', y: 11 },
            { name: 'ghi', y: 7 }
        ]
    }]
});

One of these steps should get your legends and tooltips showing up. Let me know if you hit any snags!

内容的提问来源于stack exchange，提问作者Marino