|
Essential Chart supports displaying multiple charts in same web page using different chart object container. To create multiple chart, you need to create chart container tag <div id="container"></div> for each chart. Based on the requirement, you can create multiple chart containers with different id and display charts in web page. Refer to the following code examples. HTML <div id="container"></div> <div id="container1"></div>
JS $("#container1").ejChart({
series: [{
points: [{ x: 'Walmart', y: 13, text: '13%' },
{ x: 'Apple', y: 25, text: '25%' },
{ x: 'Best Buy', y: 12, text: '12%' },
{ x: 'Target', y: 7, text: '7%' },
{ x: 'Amazon', y: 10, text: '10%' },
{ x: 'Wenger', y: 13, text: '13%' },
{ x: 'Others', y: 20, text: '20%' }
],
name: 'Newyork', type: 'pie', explode: true,
}],
});
$("#container").ejChart({
series: [{
points: [{ x: 1980, y: 11 }, { x: 1984, y: 13 },
{ x: 1988, y: 16 }, { x: 1992, y: 17 }, { x: 1996, y: 17 }, { x: 2000, y: 18 }, { x: 2004, y: 20 },
{ x: 2008, y: 22 }, { x: 2012, y: 24 }],
name: 'India', type: "column"
}],
});
JS Playground Link: Multiple Charts
Screenshot Following screenshot displays more than one chart in a page
|
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
