Flot Chart API - legends on outside of the charts

Question

I want to write pie chart using flot chart api

image pie chart 1

and I want draw like this above, but my chart satus is

image pie chart 2

same above picture, so I want to remove title on chart, but maintain percentage info like first image.

Attch my chart option:

// myChartOption
var options = {
        series: {
            pie: {
                show: true,
                label: {
                    show:true,
                    radius: 0.8,
                    formatter: function (label, series) {
                        return '<div style="border:1px solid grey;font-size:8pt;text-align:center;padding:5px;color:white;">' +
                        label + ' : ' +
                        Math.round(series.percent) +
                        '%</div>';
                    },
                    background: {
                        opacity: 0.8,
                        color: '#000'
                    }
                }
            }
            /*
            pie: {
                show: true,
                radius: 1,
                label: {
                    show: true,
                    radius: 2/3,
                    formatter: labelFormatter,
                }
            }
            */
        },
        legend: {
            container:$("#" + legendContainer),
            show: true
        }
    };

Answer 1

First, welcome to the stackoverflow community and happy coding. Please add your code to the question, it makes it more readable and helps people to understand the problem better.

Take a look at the official documentation about the chart legends and an example here.

You should add to your settings something like this:

var legendContainer = document.getElementById('#my-legend-container'); // your container of the legends
legend: {
    show: true,
    position: "ne", // north east, please refer to documentation for "ne" or "nw" or "se" or "sw"
    container: legendContainer, // jQuery object/DOM element/jQuery expression
}