{"id":136,"date":"2011-02-25T19:47:20","date_gmt":"2011-02-25T19:47:20","guid":{"rendered":"http:\/\/demo.aivahthemes.com\/hostme\/?page_id=136"},"modified":"2011-02-25T19:47:20","modified_gmt":"2011-02-25T19:47:20","slug":"google-chart","status":"publish","type":"page","link":"https:\/\/www.aivahthemes.com\/hostme\/shortcodes\/google-chart\/","title":{"rendered":"Google Chart"},"content":{"rendered":"<h1>Google Charts Shortcode<\/h1>\n<p>The Google Charts is extremely simple way to create charts  from some data and embed it in a website. The theme provides your Google Chart shortcode that makes the process even easier and lets create few types of charts. It is really simple to post using the shortcode.<\/p>\n<h2>3D Pie Chart Title<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbdda();\n\t\t});\n\n        function draw_chart_6a2d3476bbdda() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t['Reffering+sites', 70],['Google', 25],['Yahoo', 20.01],['Other', 4.99]\t\t\t]);\n\n            var options = {\n                title: '3D Pie Chart Title',\n                backgroundColor: '#bg,s,ffffff',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"058DC7\",\"50B432\",\"ED561B\",\"EDEF00\"]            };\n\n            var chart = new google.visualization.PieChart(document.getElementById('chart_6a2d3476bbdda'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbdda\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"70,25,20.01,4.99\"\nlabels=\"Reffering+sites|Google|Yahoo|Other\"\ncolors=\"058DC7,50B432,ED561B,EDEF00\"\nbg=\"bg,s,ffffff\"\nsize=\"630x250\"\ntitle=\"3D Pie Chart Title\"\ntype=\"pie\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n<h2>Line Chart Title<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbe61();\n\t\t});\n\n        function draw_chart_6a2d3476bbe61() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t['2010', 70],['2011', 25],['2012', 20.01],['2013', 4.99]\t\t\t]);\n\n            var options = {\n                title: 'Line Chart Title',\n                backgroundColor: '#bg,s,ffffff',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"058DC7\",\"50B432\",\"ED561B\",\"EDEF00\"]            };\n\n            var chart = new google.visualization.ColumnChart(document.getElementById('chart_6a2d3476bbe61'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbe61\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"70,25,20.01,4.99\"\nlabels=\"2010|2011|2012|2013\"\ncolors=\"058DC7,50B432,ED561B,EDEF00\"\nbg=\"bg,s,ffffff\"\nsize=\"630x250\"\ntitle=\"Line Chart Title\"\ntype=\"line\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n<h2>Line Chart Title 2<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbea4();\n\t\t});\n\n        function draw_chart_6a2d3476bbea4() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t\t\t\t]);\n\n            var options = {\n                title: 'Line Chart Title 2',\n                backgroundColor: '#bg,s,ffffff',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"058DC7\",\"50B432\"]            };\n\n            var chart = new google.visualization.ColumnChart(document.getElementById('chart_6a2d3476bbea4'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbea4\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"0,25,50,75,100|2,33,43,17,25|0,25,50,75,100|0,20,25,40,75\"\nlabels=\"Begin|25|50|75|End\"\ncolors=\"058DC7,50B432\"\nbg=\"bg,s,ffffff\"\nsize=\"630x250\"\ntitle=\"Line Chart Title 2\"\ntype=\"xyline\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n<h2>Scatter Chart Title<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbed5();\n\t\t});\n\n        function draw_chart_6a2d3476bbed5() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t\t\t\t]);\n\n            var options = {\n                title: 'Scatter Chart Title',\n                backgroundColor: '#bg,s,ffffff',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"058DC7\"]            };\n\n            var chart = new google.visualization.ColumnChart(document.getElementById('chart_6a2d3476bbed5'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbed5\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"0,10,20,30,40,50,60,70,80,90,100|50,52,56,63,70,80,92,85,75,60,43\"\nlabels=\"1|2|3|4|5|6|7|8|9|10\"\ncolors=\"058DC7\"\nbg=\"bg,s,ffffff\"\nsize=\"630x250\"\ntitle=\"Scatter Chart Title\"\ntype=\"scatter\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n<h2>Pie Chart Title<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbf04();\n\t\t});\n\n        function draw_chart_6a2d3476bbf04() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t['Reffering+sites', 70],['Google', 25],['Yahoo', 20.01],['Other', 4.99]\t\t\t]);\n\n            var options = {\n                title: 'Pie Chart Title',\n                backgroundColor: '#bg,s,ffffff',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"058DC7\",\"50B432\",\"ED561B\",\"EDEF00\"]            };\n\n            var chart = new google.visualization.ColumnChart(document.getElementById('chart_6a2d3476bbf04'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbf04\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"70,25,20.01,4.99\"\nlabels=\"Reffering+sites|Google|Yahoo|Other\"\ncolors=\"058DC7,50B432,ED561B,EDEF00\"\nbg=\"bg,s,ffffff\"\nsize=\"630x250\"\ntitle=\"Pie Chart Title\"\ntype=\"pie2d\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n<h2>Gom Chart Title<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbf41();\n\t\t});\n\n        function draw_chart_6a2d3476bbf41() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t['Forty', 40]\t\t\t]);\n\n            var options = {\n                title: 'Gom Chart Title',\n                backgroundColor: '#bg,s,F7F9FA',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"058DC7\",\"50B432\",\"ED561B\",\"EDEF00\"]            };\n\n            var chart = new google.visualization.ColumnChart(document.getElementById('chart_6a2d3476bbf41'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbf41\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"40\"\nlabels=\"Forty\"\ncolors=\"058DC7,50B432,ED561B,EDEF00\"\nbg=\"bg,s,F7F9FA\"\nsize=\"630x250\"\ntitle=\"Gom Chart Title\"\ntype=\"gom\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n<h2>Venn Chart Title<\/h2>\n    <script type=\"text\/javascript\">\n        google.charts.load(\"current\", {packages:[\"corechart\"]});\n\t\tgoogle.charts.setOnLoadCallback(function() {\n\t\t\tdraw_chart_6a2d3476bbf7f();\n\t\t});\n\n        function draw_chart_6a2d3476bbf7f() {\n            var data = new google.visualization.DataTable();\n\t\t\tdata.addColumn('string', 'Label');\n\t\t\tdata.addColumn('number', 'Value');\n\t\t\tdata.addRows([\n\t\t\t\t\t\t\t]);\n\n            var options = {\n                title: 'Venn Chart Title',\n                backgroundColor: '#bg,s,F7F9FA',\n                width: 630,\n                height: 250,\n\t\t\t\tcolors: [\"FF6342\",\"ADDE63\",\"63C6DE\"]            };\n\n            var chart = new google.visualization.ColumnChart(document.getElementById('chart_6a2d3476bbf7f'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a2d3476bbf7f\" style=\"width: 630px; height: 250px;\"><\/div>\n    \n<h4 class=\"toggle\"><a href=\"#\">Get The Code<\/a><\/h4><div class=\"toggle_content\" style=\"display: none;\"><div class=\"toggleinside\">\n<pre>\n&#091;chart\ndata=\"100,80,60,30,30,30,10\"\ncolors=\"FF6342,ADDE63,63C6DE\"\nbg=\"bg,s,F7F9FA\"\nsize=\"630x250\"\ntitle=\"Venn Chart Title\"\nadvanced=\"&amp;chdl=A|B|C\"\ntype=\"venn\"]\n<\/pre>\n<\/div><\/div>\n<div class=\"divider top\"><a href=\"#\">Top<\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Google Charts Shortcode The Google Charts is extremely simple way to create charts from some data and embed it in a website. The theme provides your Google Chart shortcode that makes the process even easier and lets create few types of charts. It is really simple to post using the shortcode. 3D Pie Chart Title [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":126,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":{"footnotes":""},"class_list":["post-136","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/pages\/136","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/comments?post=136"}],"version-history":[{"count":0,"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/pages\/136\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/pages\/126"}],"wp:attachment":[{"href":"https:\/\/www.aivahthemes.com\/hostme\/wp-json\/wp\/v2\/media?parent=136"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}