{"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_6aea4ffe44351();\n\t\t});\n\n        function draw_chart_6aea4ffe44351() {\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_6aea4ffe44351'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe44351\" 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_6aea4ffe443c0();\n\t\t});\n\n        function draw_chart_6aea4ffe443c0() {\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_6aea4ffe443c0'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe443c0\" 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_6aea4ffe443fb();\n\t\t});\n\n        function draw_chart_6aea4ffe443fb() {\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_6aea4ffe443fb'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe443fb\" 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_6aea4ffe44431();\n\t\t});\n\n        function draw_chart_6aea4ffe44431() {\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_6aea4ffe44431'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe44431\" 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_6aea4ffe4445f();\n\t\t});\n\n        function draw_chart_6aea4ffe4445f() {\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_6aea4ffe4445f'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe4445f\" 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_6aea4ffe44496();\n\t\t});\n\n        function draw_chart_6aea4ffe44496() {\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_6aea4ffe44496'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe44496\" 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_6aea4ffe444c2();\n\t\t});\n\n        function draw_chart_6aea4ffe444c2() {\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_6aea4ffe444c2'));\n            chart.draw(data, options);\n        }\n    <\/script>\n    <div id=\"chart_6aea4ffe444c2\" 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}]}}