{"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_6aac8802d4f73();\n\t\t});\n\n        function draw_chart_6aac8802d4f73() {\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_6aac8802d4f73'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d4f73\" 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_6aac8802d4fed();\n\t\t});\n\n        function draw_chart_6aac8802d4fed() {\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_6aac8802d4fed'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d4fed\" 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_6aac8802d5035();\n\t\t});\n\n        function draw_chart_6aac8802d5035() {\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_6aac8802d5035'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d5035\" 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_6aac8802d506f();\n\t\t});\n\n        function draw_chart_6aac8802d506f() {\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_6aac8802d506f'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d506f\" 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_6aac8802d50a5();\n\t\t});\n\n        function draw_chart_6aac8802d50a5() {\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_6aac8802d50a5'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d50a5\" 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_6aac8802d50e5();\n\t\t});\n\n        function draw_chart_6aac8802d50e5() {\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_6aac8802d50e5'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d50e5\" 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_6aac8802d5118();\n\t\t});\n\n        function draw_chart_6aac8802d5118() {\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_6aac8802d5118'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aac8802d5118\" 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}]}}