{"id":15594,"date":"2017-01-11T13:18:05","date_gmt":"2017-01-11T07:48:05","guid":{"rendered":"http:\/\/www.fusioncharts.com\/blog\/?p=15594"},"modified":"2026-01-20T14:37:20","modified_gmt":"2026-01-20T09:07:20","slug":"analytic-dashboard-using-drupal-fusioncharts","status":"publish","type":"post","link":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/","title":{"rendered":"Analytic Dashboard Using Drupal and FusionCharts 2026"},"content":{"rendered":"<p><b>Drupal<\/b> is a content management software with a lot of useful and  powerful features, like easy content authoring, reliable performance, and excellent security. The flexibility and modularity of Drupal is what gives the extra edge as a content management software. Its tools help us to build the versatile, structured content that dynamic web experiences need.<\/p>\n<p>It is designed to be the perfect content management solution for admins and moderators, who needs both simplicity and flexibility. It accomplishes this through its modular approach to site building.<\/p>\n<p>For more details about drupal, click here.<\/p>\n<p>In this article, you will see how to use FusionCharts in combination with Drupal to create an interactive analytic dashboard. Let\u2019s now move on to how you can create the perfect dashboard using FusionCharts and Drupal. Following are some of the use cases for different kinds of users:<\/p>\n<ul>\n<li><b>Admins:<\/b> To analyze traffic on website, and how the content is working<\/li>\n<li><b>Moderators:<\/b> To see how their content is working, views on pages, articles, etc<\/li>\n<\/ul>\n<p>To get the code in this blog working, we need to install the following components:<\/p>\n<ul>\n<li><b>Xampp:<\/b> We are going to use the XAMPP server for this tutorial. You can use any other server that supports PHP and its frameworks like the MAMP server, the AMPPS server, etc. You can download XAMPP from <a href=\"https:\/\/www.apachefriends.org\/download.html\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a>; it is available across all major platforms including Windows, OS X, and Linux.<\/li>\n<li><b>FusionCharts:<\/b> You can download the latest version of FusionCharts Suite XT from <a href=\"https:\/\/www.fusioncharts.com\/download\/\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a>. Alternately, you can also install it using the npm or bower package managers, using the commands given below:\n<ol>\n<li>For npm:\n<pre class=\"lang:powershell\">npm install fusioncharts\r\nnpm install fusionmaps<\/pre>\n<\/li>\n<li>For Bower:\n<pre class=\"lang:powershell\">bower install fusioncharts\r\nbower install fusionmaps<\/pre>\n<\/li>\n<\/ol>\n<\/li>\n<li><b>Drupal:<\/b> Download drupal and keep the extracted file in xampp\/htdocs folder as shown in the image below:\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png\" alt=\"file_loc\" width=\"620\" height=\"160\" class=\"alignnone size-full wp-image-15598\" \/><\/a><\/p>\n<p>Inside the drupal folder, go through the path <b>drupal\\sites\\default<\/b> and  duplicate the <b>default.settings.php<\/b> file and rename that duplicate file as <b>settings.php<\/b>. <\/p>\n<p>Once done, create a new folder called <b>files<\/b> and keep that inside the default folder.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/model.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/model.png\" alt=\"model\" width=\"620\" height=\"160\" class=\"alignnone size-full wp-image-15601\" \/><\/a><\/li>\n<\/ul>\n<p>Now install the drupal using localhost.<br \/>\nEg. https:\/\/localhost\/drupal\/<\/p>\n<p>Install drupal by connecting the database. For detailed installation process click here.<\/p>\n<p>After installing drupal, login to the site. Once you login successfully the drupal Welcome page will appear as shown below:<\/p>\n<p>Click <b>Structure<\/b> in the admin bar, which provides several options as shown in the image below:<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/structure1.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/structure1.png\" alt=\"structure1\" width=\"620\" height=\"350\" class=\"alignnone size-full wp-image-15606\" \/><\/a><\/p>\n<p>Click on <b>Blocks<\/b><\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/block.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/block.png\" alt=\"block\" width=\"620\" height=\"270\" class=\"alignnone size-full wp-image-15608\" \/><\/a><\/p>\n<p>The <b>Add block<\/b> option appears. Click Add block to create the block for your dashboard.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/block-title.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/block-title.png\" alt=\"block title\" width=\"620\" height=\"220\" class=\"alignnone size-full wp-image-15609\" \/><\/a><\/p>\n<p>*Fill the required fields, i.e. <b>Block title<\/b> and <b>Block description<\/b>.<\/p>\n<p>After filling up the details, check the <b>Block<\/b> body which contains the code for the chart. <\/p>\n<p>P.S- We have used FusionCharts Suite XT, PHP, and MySQL to create the dynamic charts for the dashboard.<\/p>\n<p>Keep the data table required for the dashboard inside the database, to connect drupal at the time of installation.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/database.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/database.png\" alt=\"database\" width=\"620\" height=\"260\" class=\"alignnone size-full wp-image-15611\" \/><\/a><\/p>\n<p>The first part of the php code, helps you to connect with the database required for the dashboard.<\/p>\n<pre class=\"lang:php\">connect_error) {\r\n     exit(\"There was an error with your connection: \".$dbhandle-&gt;connect_error);\r\n   }\r\n?&gt;<\/pre>\n<p>Extract files from the downloaded FusionCharts Suite XT and keep the fusioncharts.js and fusioncharts.charts.js file inside a folder and keep that folder inside the directory called <b>modules<\/b> inside the <b>drupal<\/b> folder.<br \/>\ne.g. C:\\xampp\\htdocs\\drupal\\modules\\lib<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/lib.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/lib.png\" alt=\"lib\" width=\"620\" height=\"140\" class=\"alignnone size-full wp-image-15612\" \/><\/a><\/p>\n<p>Similarly, keep the fusioncharts.theme.fint.js inside the directory called themes inside the drupal folder.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/theme.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/theme.png\" alt=\"theme\" width=\"620\" height=\"200\" class=\"alignnone size-full wp-image-15613\" \/><\/a><\/p>\n<p>In the second part of PHP code, include the paths of library files fusioncharts.js, fusioncharts.charts.js and fusioncharts.theme.fint.js using the <b>drupal_add_js()<\/b> function as shown below(Include these files inside any one block, the entire page will be able to use these script files, i.e. no need to add these files inside every block.).<\/p>\n<pre class=\"lang:java\"> drupal_add_js('modules\/lib\/fusioncharts.js');\r\ndrupal_add_js('modules\/lib\/fusioncharts.charts.js');\r\ndrupal_add_js('themes\/fusioncharts.theme.fint.js');<\/pre>\n<p>Download the fusioncharts php wrapper and keep the fusioncharts.php file inside <b>modules\/php<\/b> folder.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/php_module.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/php_module.png\" alt=\"php_module\" width=\"620\" height=\"150\" class=\"alignnone size-full wp-image-15615\" \/><\/a><\/p>\n<p>Include the <b>fusioncharts.php<\/b> inside the php.module code.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/phpCode.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/phpCode.png\" alt=\"phpCode\" width=\"620\" height=\"270\" class=\"alignnone size-full wp-image-15616\" \/><\/a><\/p>\n<p>Once the FusionCharts php wrapper is included let\u2019s get back to the code. Inside php tag, using sql query, fetch the data from the database.<\/p>\n<pre lang=\"PHP\">$strQuery = \"SELECT DISTINCT revenue_type, revenue_value,revenue_budget, expenditure_type, expenditure_value,expenditure_budget FROM financial_records\";\r\n $result = $dbhandle-&gt;query($strQuery) or exit(\"Error code ({$dbhandle-&gt;errno}): {$dbhandle-&gt;error}\");<\/pre>\n<p>Achieve the required json format using php,to render the chart. <\/p>\n<pre class=\"lang:javascript\"> if ($result) {\r\n     \/\/Creating the chart object\r\n     $arrData1 = array(\r\n        \"chart\" =&gt; array(\r\n                    \"paletteColors\" =&gt; \"#23B7B7,#ED3132,#3CDAE0\",\r\n                    \"bgColor\" =&gt; \"#EAEAEA\",\r\n                    \"showLabels\"=&gt;\"0\",\r\n                    \"showBorder\" =&gt; \"0\",\r\n                    \"use3DLighting\" =&gt; \"0\",\r\n                    \"showShadow\" =&gt; \"0\",\r\n                    \"enableSmartLabels\" =&gt; \"0\",\r\n                    \"startingAngle\" =&gt; \"0\",\r\n                    \"showPercentValues\" =&gt; \"1\",\r\n                    \"showPercentInTooltip\" =&gt; \"0\",\r\n                    \"decimals\" =&gt; \"1\",\r\n                    \"captionFontSize\" =&gt; \"14\",\r\n                    \"subcaptionFontSize\" =&gt; \"14\",\r\n                    \"subcaptionFontBold\" =&gt; \"0\",\r\n                    \"toolTipColor\" =&gt; \"#ffffff\",\r\n                    \"toolTipBorderThickness\" =&gt; \"0\",\r\n                    \"toolTipBgColor\" =&gt; \"#000000\",\r\n                    \"toolTipBgAlpha\" =&gt; \"80\",\r\n                    \"toolTipBorderRadius\" =&gt; \"2\",\r\n                    \"toolTipPadding\" =&gt; \"5\",\r\n                    \"showHoverEffect\" =&gt; \"1\",\r\n                    \"showLegend\" =&gt; \"1\",\r\n                    \"legendBgColor\" =&gt; \"#ffffff\",\r\n                    \"legendBorderAlpha\" =&gt; \"0\",\r\n                    \"legendShadow\" =&gt; \"0\",\r\n                    \"legendItemFontSize\" =&gt; \"10\",\r\n                    \"legendItemFontColor\" =&gt; \"#666666\",\r\n                    \"useDataPlotColorForLabels\" =&gt; \"1\",\r\n                    \"theme\"=&gt;\"fint\"\r\n               )\r\n          );\r\n\r\n    \/\/creating the data array\r\n        $arrData1[\"data\"]=array();\r\n          while($row = mysqli_fetch_array($result)) {\r\n                            \r\n                    array_push($arrData1[\"data\"], array(\r\n\r\n                          \"label\" =&gt; $row[\"expenditure_type\"],\r\n                          \"value\"=&gt;$row[\"expenditure_value\"]\r\n                         )\r\n                    );      \r\n          }\r\n\r\n    \/\/encoding the array in json format\r\n      $jsonEncodedData_chart1 = json_encode($arrData1);\r\n     \r\n$expenditureChart = new FusionCharts(\"pie2d\", \"chart2\" , \"100%\", \"300\", \"chart-container2\", \"json\", $jsonEncodedData_chart1);\r\n\r\n\/\/rendering the chart\r\n      $expenditureChart-&gt;render();\r\n\r\n      \/\/ closing db connection\r\n      $dbhandle-&gt;close();\r\n   }\r\n?&gt;<\/pre>\n<p>Finally define the div where the chart will render.<br \/>\ni.e. <\/p>\n<pre class=\"lang:markup\"><div id=\"chart-container2\">Chart will render here!<\/div><\/pre>\n<p>Keep this code inside Block body.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/body.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/body.png\" alt=\"body\" width=\"620\" height=\"310\" class=\"alignnone size-full wp-image-15617\" \/><\/a><\/p>\n<p>Select the text format as php code. [ If this option doesn&#8217;t appear click  on Modules. Scroll down to the <b>PHP filter<\/b> module and check the Enabled box.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/module.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/module.png\" alt=\"module\" width=\"620\" height=\"240\" class=\"alignnone size-full wp-image-15618\" \/><\/a><\/p>\n<p>Press the <b>Save Configuration<\/b> button<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/saveConfig.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/saveConfig.png\" alt=\"saveConfig\" width=\"620\" height=\"200\" class=\"alignnone size-full wp-image-15619\" \/><\/a><\/p>\n<p>Now, again scroll down to the <b>PHP filter<\/b> module where two links have been added. The first is help. It&#8217;s not long and is worth reading, so check it out. The second link is <b>permissions<\/b>. Click on this to go to the Permissions page.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/help_permissions.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/help_permissions.png\" alt=\"help_permissions\" width=\"620\" height=\"250\" class=\"alignnone size-full wp-image-15620\" \/><\/a><\/p>\n<p>Scroll down to the <b>Filter<\/b> section. There is a new item called Use the PHP code text format and its checkbox for the <b>Administrator<\/b> is not checked. The permission box must be checked for the role that needs to use PHP code in order for the PHP filter to show on input boxes. <\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/filter.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/filter.png\" alt=\"filter\" width=\"620\" height=\"210\" class=\"alignnone size-full wp-image-15621\" \/><\/a><\/p>\n<p>Finally click on <b>Save permissions<\/b>.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/savePermissions2.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/savePermissions2.png\" alt=\"savePermissions2\" width=\"620\" height=\"200\" class=\"alignnone size-full wp-image-15622\" \/><\/a><\/p>\n<p>Inside the <b>REGION SETTINGS<\/b>, specify in which themes and regions this block is going to be displayed.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/format-and-region.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/format-and-region.png\" alt=\"format and region\" width=\"620\" height=\"250\" class=\"alignnone size-full wp-image-15623\" \/><\/a><\/p>\n<p>Once done save the block. Similarly construct other blocks and render the chart inside the block body, which are required for the dashboard.<\/p>\n<p>Here is the snapshot of the final; dashboard.<\/p>\n<p><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/dashboard.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/dashboard.png\" alt=\"dashboard\" width=\"620\" height=\"380\" class=\"alignnone size-full wp-image-15624\" \/><\/a><\/p>\n<p>Perfect isn\u2019t it?<\/p>\n<p>If you see any errors in your code, click <a href=\"https:\/\/www.dropbox.com\/s\/mz06nq7dnen5c0u\/myDashboard.zip?dl=0\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a> to download the complete source code of the dashboard we have created for this tutorial.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Drupal is a content management software with a lot of useful and powerful features, like easy content authoring, reliable performance, and excellent security. The flexibility and modularity of Drupal is what gives the extra edge as a content management software. Its tools help us to build the versatile, structured content that dynamic web experiences need. [&hellip;]<\/p>\n","protected":false},"author":31,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[609,610,611,608,152,605],"coauthors":[647,653],"class_list":["post-15594","post","type-post","status-publish","format-standard","hentry","category-tutorials","tag-analytic-dashboard","tag-analytic-dashboard-using-drupal","tag-analytic-dashboard-using-drupal-and-fusioncharts","tag-drupal","tag-fusioncharts","tag-xampp"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Build Analytic Dashboard Using Drupal and FusionCharts<\/title>\n<meta name=\"description\" content=\"Drupal manages your content, but it can do a lot more. This guide shows how to wire interactive charts into a Drupal CMS and build a live analytic dashboard.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Build Analytic Dashboard Using Drupal and FusionCharts\" \/>\n<meta property=\"og:description\" content=\"Drupal manages your content, but it can do a lot more. This guide shows how to wire interactive charts into a Drupal CMS and build a live analytic dashboard.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\" \/>\n<meta property=\"og:site_name\" content=\"FusionBrew - The FusionCharts Blog\" \/>\n<meta property=\"article:published_time\" content=\"2017-01-11T07:48:05+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-20T09:07:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2017\/01\/file_loc.png\" \/>\n\t<meta property=\"og:image:width\" content=\"864\" \/>\n\t<meta property=\"og:image:height\" content=\"178\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Dishank Tiwari, Prerana Singh\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Dishank Tiwari, Prerana Singh\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\n\t    \"@context\": \"https:\/\/schema.org\",\n\t    \"@graph\": [\n\t        {\n\t            \"@type\": \"Article\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#article\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\"\n\t            },\n\t            \"author\": {\n\t                \"name\": \"Dishank Tiwari\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/9106ebef0b6b4fec8a2bb46862ee02ad\"\n\t            },\n\t            \"headline\": \"Analytic Dashboard Using Drupal and FusionCharts 2026\",\n\t            \"datePublished\": \"2017-01-11T07:48:05+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:07:20+00:00\",\n\t            \"mainEntityOfPage\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\"\n\t            },\n\t            \"wordCount\": 901,\n\t            \"commentCount\": 0,\n\t            \"publisher\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage\"\n\t            },\n\t            \"thumbnailUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png\",\n\t            \"keywords\": [\n\t                \"Analytic Dashboard\",\n\t                \"Analytic Dashboard using drupal\",\n\t                \"Analytic Dashboard using drupal and fusioncharts\",\n\t                \"drupal\",\n\t                \"FusionCharts\",\n\t                \"XAMPP\"\n\t            ],\n\t            \"articleSection\": [\n\t                \"Tutorials\"\n\t            ],\n\t            \"inLanguage\": \"en-US\",\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"CommentAction\",\n\t                    \"name\": \"Comment\",\n\t                    \"target\": [\n\t                        \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#respond\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebPage\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\",\n\t            \"name\": \"Build Analytic Dashboard Using Drupal and FusionCharts\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#website\"\n\t            },\n\t            \"primaryImageOfPage\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage\"\n\t            },\n\t            \"thumbnailUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png\",\n\t            \"datePublished\": \"2017-01-11T07:48:05+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:07:20+00:00\",\n\t            \"description\": \"Drupal manages your content, but it can do a lot more. This guide shows how to wire interactive charts into a Drupal CMS and build a live analytic dashboard.\",\n\t            \"breadcrumb\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#breadcrumb\"\n\t            },\n\t            \"inLanguage\": \"en-US\",\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"ReadAction\",\n\t                    \"target\": [\n\t                        \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"ImageObject\",\n\t            \"inLanguage\": \"en-US\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png\",\n\t            \"contentUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png\"\n\t        },\n\t        {\n\t            \"@type\": \"BreadcrumbList\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#breadcrumb\",\n\t            \"itemListElement\": [\n\t                {\n\t                    \"@type\": \"ListItem\",\n\t                    \"position\": 1,\n\t                    \"name\": \"Home\",\n\t                    \"item\": \"https:\/\/www.fusioncharts.com\/blog\/\"\n\t                },\n\t                {\n\t                    \"@type\": \"ListItem\",\n\t                    \"position\": 2,\n\t                    \"name\": \"Analytic Dashboard Using Drupal and FusionCharts 2026\"\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebSite\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#website\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/\",\n\t            \"name\": \"FusionBrew - The FusionCharts Blog\",\n\t            \"description\": \"Get tips and tricks on how to build effective Data Visualisation using FusionCharts\",\n\t            \"publisher\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\"\n\t            },\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"SearchAction\",\n\t                    \"target\": {\n\t                        \"@type\": \"EntryPoint\",\n\t                        \"urlTemplate\": \"https:\/\/www.fusioncharts.com\/blog\/?s={search_term_string}\"\n\t                    },\n\t                    \"query-input\": {\n\t                        \"@type\": \"PropertyValueSpecification\",\n\t                        \"valueRequired\": true,\n\t                        \"valueName\": \"search_term_string\"\n\t                    }\n\t                }\n\t            ],\n\t            \"inLanguage\": \"en-US\"\n\t        },\n\t        {\n\t            \"@type\": \"Organization\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\",\n\t            \"name\": \"FusionCharts\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/\",\n\t            \"logo\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/\",\n\t                \"url\": \"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg\",\n\t                \"contentUrl\": \"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg\",\n\t                \"width\": 1,\n\t                \"height\": 1,\n\t                \"caption\": \"FusionCharts\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/\"\n\t            }\n\t        },\n\t        {\n\t            \"@type\": \"Person\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/9106ebef0b6b4fec8a2bb46862ee02ad\",\n\t            \"name\": \"Dishank Tiwari\",\n\t            \"image\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/edab16f3ae97d48c528d1820c0597954\",\n\t                \"url\": \"\/blog\/wp-content\/wphb-cache\/gravatar\/589\/58951cd49296e6fe39049faab4be5f7cx96.jpg\",\n\t                \"contentUrl\": \"\/blog\/wp-content\/wphb-cache\/gravatar\/589\/58951cd49296e6fe39049faab4be5f7cx96.jpg\",\n\t                \"caption\": \"Dishank Tiwari\"\n\t            },\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/author\/dishank-tiwari\/\"\n\t        }\n\t    ]\n\t}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Build Analytic Dashboard Using Drupal and FusionCharts","description":"Drupal manages your content, but it can do a lot more. This guide shows how to wire interactive charts into a Drupal CMS and build a live analytic dashboard.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/","og_locale":"en_US","og_type":"article","og_title":"Build Analytic Dashboard Using Drupal and FusionCharts","og_description":"Drupal manages your content, but it can do a lot more. This guide shows how to wire interactive charts into a Drupal CMS and build a live analytic dashboard.","og_url":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/","og_site_name":"FusionBrew - The FusionCharts Blog","article_published_time":"2017-01-11T07:48:05+00:00","article_modified_time":"2026-01-20T09:07:20+00:00","og_image":[{"width":864,"height":178,"url":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2017\/01\/file_loc.png","type":"image\/png"}],"author":"Dishank Tiwari, Prerana Singh","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Dishank Tiwari, Prerana Singh","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#article","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/"},"author":{"name":"Dishank Tiwari","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/9106ebef0b6b4fec8a2bb46862ee02ad"},"headline":"Analytic Dashboard Using Drupal and FusionCharts 2026","datePublished":"2017-01-11T07:48:05+00:00","dateModified":"2026-01-20T09:07:20+00:00","mainEntityOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/"},"wordCount":901,"commentCount":0,"publisher":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png","keywords":["Analytic Dashboard","Analytic Dashboard using drupal","Analytic Dashboard using drupal and fusioncharts","drupal","FusionCharts","XAMPP"],"articleSection":["Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/","url":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/","name":"Build Analytic Dashboard Using Drupal and FusionCharts","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png","datePublished":"2017-01-11T07:48:05+00:00","dateModified":"2026-01-20T09:07:20+00:00","description":"Drupal manages your content, but it can do a lot more. This guide shows how to wire interactive charts into a Drupal CMS and build a live analytic dashboard.","breadcrumb":{"@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#primaryimage","url":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png","contentUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/01\/file_loc.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.fusioncharts.com\/blog\/analytic-dashboard-using-drupal-fusioncharts\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.fusioncharts.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Analytic Dashboard Using Drupal and FusionCharts 2026"}]},{"@type":"WebSite","@id":"https:\/\/www.fusioncharts.com\/blog\/#website","url":"https:\/\/www.fusioncharts.com\/blog\/","name":"FusionBrew - The FusionCharts Blog","description":"Get tips and tricks on how to build effective Data Visualisation using FusionCharts","publisher":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.fusioncharts.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.fusioncharts.com\/blog\/#organization","name":"FusionCharts","url":"https:\/\/www.fusioncharts.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/","url":"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg","contentUrl":"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg","width":1,"height":1,"caption":"FusionCharts"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/9106ebef0b6b4fec8a2bb46862ee02ad","name":"Dishank Tiwari","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/edab16f3ae97d48c528d1820c0597954","url":"\/blog\/wp-content\/wphb-cache\/gravatar\/589\/58951cd49296e6fe39049faab4be5f7cx96.jpg","contentUrl":"\/blog\/wp-content\/wphb-cache\/gravatar\/589\/58951cd49296e6fe39049faab4be5f7cx96.jpg","caption":"Dishank Tiwari"},"url":"https:\/\/www.fusioncharts.com\/blog\/author\/dishank-tiwari\/"}]}},"_links":{"self":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/15594","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/users\/31"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/comments?post=15594"}],"version-history":[{"count":0,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/15594\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/media?parent=15594"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/categories?post=15594"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/tags?post=15594"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/coauthors?post=15594"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}