Static Chart
These charts and graphs are static and you can generate your charts from online chart generators that use google api to render the charts
-
view code
<img src="http://chart.apis.google.com/chart?chtt=Items+uploaded+on+marketplaces+in+the+last+5+years&chts=000000,15&chs=600x250&chf=bg,s,F0F0F0&cht=p3&chd=t:4.45,10.01,39.05,10.86,29.78,3.34,1.85,0.61&chl=Themeforest|Activeden|Audio+Jungle|Videohive|Graphicriver|3D+Ocean|Codecanyon|Tutorials&chco=7d5e3b,f18726,93a92f,e7a30f,006eb3,860b26,c23917,ee9900" alt="Google Chart"/>
Diagram Interactive & Graphs
These charts and graphs are interactive in nature using the google charts api. Hover over a segment to view more details
Distribution of marketplace members around the world
-
view javascript code
// Load the Visualization API and the piechart package. google.load('visualization', '1.0', {'packages':['corechart']}); google.setOnLoadCallback(drawChart); function drawChart() { // PIE chart var data_p = new google.visualization.DataTable(); data_p.addColumn('string', 'Topping'); data_p.addColumn('number', 'Slices'); data_p.addRows([ ['Themeforest', 5000], ['Activeden', 11231], ['Audio Jungle', 43801], ['Videohive', 12188], ['Graphicriver', 33399], ['3D Ocean', 3747], ['Codecanyon', 2079], ['Tutorials', 693] ]); // Set chart options var options_p = {'title':'Items uploaded on marketplaces in the last 5 years', 'width':600, 'height':300, fontName: 'Helvetica', legend: 'right', colors: ['#7d5e3b', '#f18726', '#93a92f', '#e7a30f', '#006eb3', '#860b26', '#c23917', '#ee9900'], is3D: true, backgroundColor: 'transparent'}; var chart = new google.visualization.PieChart(document.getElementById('p_chart_div')); chart.draw(data_p, options_p);