{"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_6a6f999ed584a();\n\t\t});\n\n        function draw_chart_6a6f999ed584a() {\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_6a6f999ed584a'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed584a\" 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_6a6f999ed58cf();\n\t\t});\n\n        function draw_chart_6a6f999ed58cf() {\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_6a6f999ed58cf'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed58cf\" 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_6a6f999ed5915();\n\t\t});\n\n        function draw_chart_6a6f999ed5915() {\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_6a6f999ed5915'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed5915\" 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_6a6f999ed594c();\n\t\t});\n\n        function draw_chart_6a6f999ed594c() {\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_6a6f999ed594c'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed594c\" 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_6a6f999ed5997();\n\t\t});\n\n        function draw_chart_6a6f999ed5997() {\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_6a6f999ed5997'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed5997\" 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_6a6f999ed59dd();\n\t\t});\n\n        function draw_chart_6a6f999ed59dd() {\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_6a6f999ed59dd'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed59dd\" 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_6a6f999ed5a14();\n\t\t});\n\n        function draw_chart_6a6f999ed5a14() {\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_6a6f999ed5a14'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6a6f999ed5a14\" 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}]}}