{"id":2576,"date":"2012-03-20T20:12:47","date_gmt":"2012-03-20T14:42:47","guid":{"rendered":"http:\/\/blog.fusioncharts.com\/?p=2576"},"modified":"2026-01-20T14:41:11","modified_gmt":"2026-01-20T09:11:11","slug":"javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt","status":"publish","type":"post","link":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/","title":{"rendered":"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4"},"content":{"rendered":"In the 4th part of FusionCharts XT in PHP series, we will create LinkedCharts in PHP. <a href=\"https:\/\/www.fusioncharts.com\/dev\/chart-guide\/chart-configurations\/drill-down\">LinkedCharts<\/a> is a pioneering concept introduced by FusionCharts which allows unlimited levels of drill-down. LinkedCharts help users maintain the context when drilling down (or up) in their data. The child LinkedCharts can be configured in every way possible. Let us create LinkedCharts using the bundled PHP script, which takes the hassle out by generating the HTML, JavaScript and XML required to render any chart.\r\n<blockquote>\r\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_71 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\"><p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<\/div><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#FusionCharts_XT_in_PHP_Series\" title=\"FusionCharts XT in PHP Series\">FusionCharts XT in PHP Series<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#What_we_are_going_to_visualize\" title=\"What we are going to visualize\">What we are going to visualize<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#What_we_will_need\" title=\"What we will need\">What we will need<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Attributes_of_LinkedCharts\" title=\"Attributes of LinkedCharts\">Attributes of LinkedCharts<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#LinkedCharts_using_Data_URL\" title=\"LinkedCharts using Data URL\">LinkedCharts using Data URL<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#LinkedCharts_using_Data_String\" title=\"LinkedCharts using Data String\">LinkedCharts using Data String<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Data_URL_or_Data_String\" title=\"Data URL or Data String?\">Data URL or Data String?<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Creating_LinkedCharts_using_Data_URL_method\" title=\"Creating LinkedCharts using Data URL method\">Creating LinkedCharts using Data URL method<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Creating_LinkedCharts_using_Data_String_method\" title=\"Creating LinkedCharts using Data String method\">Creating LinkedCharts using Data String method<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Configuring_LinkedCharts\" title=\"Configuring LinkedCharts\">Configuring LinkedCharts<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#LinkedCharts_Events\" title=\"LinkedCharts Events\">LinkedCharts Events<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Download_the_source_code\" title=\"Download the source code\">Download the source code<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#Next_in_the_series\" title=\"Next in the series\">Next in the series<\/a><\/li><\/ul><\/nav><\/div>\n<h3><span class=\"ez-toc-section\" id=\"FusionCharts_XT_in_PHP_Series\"><\/span>FusionCharts XT in PHP Series<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n<ul>\r\n \t<li><a href=\"https:\/\/fusioncharts.com\/blog\/javascript-charts-in-php-using-fusioncharts-xt-part-1\/\" target=\"_blank\" rel=\"noopener noreferrer\">Part 1 &#8211; JavaScript charts in PHP using FusionCharts XT<\/a><\/li>\r\n \t<li><a href=\"https:\/\/fusioncharts.com\/blog\/javascript-charts-using-php-and-mysql-with-fusioncharts-xt-part-2\/\" target=\"_blank\" rel=\"noopener noreferrer\">Part 2 &#8211; JavaScript charts in PHP and MySQL using FusionCharts XT<\/a><\/li>\r\n \t<li><a href=\"https:\/\/fusioncharts.com\/blog\/drill-down-javascript-charts-in-php-and-mysql-part-3\/\" target=\"_blank\" rel=\"noopener noreferrer\">Part 3 &#8211; Drill-down JavaScript charts in PHP and MySQL<\/a><\/li>\r\n \t<li><a href=\"https:\/\/fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\">Part 4 &#8211; JavaScript LinkedCharts in PHP and MySQL<\/a><\/li>\r\n \t<li><a href=\"https:\/\/fusioncharts.com\/blog\/debugging-javascript-charts-with-fusioncharts-xt-part-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">Part 5 &#8211; Using Debugging Tools for JavaScript Charts<\/a><\/li>\r\n<\/ul>\r\n<\/blockquote>\r\n<h2><span class=\"ez-toc-section\" id=\"What_we_are_going_to_visualize\"><\/span>What we are going to visualize<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nIn the <a href=\"https:\/\/fusioncharts.com\/blog\/drill-down-javascript-charts-in-php-and-mysql-part-3\" target=\"_blank\" rel=\"noopener noreferrer\">3rd part<\/a> of this series, we created a simple drill-down chart, where the parent chart shows the Top 10 Most Populous Countries, and the child chart shows the Top 10 Most Populous Cities of that country.\r\n\r\nWe will make use of the same data and create a LinkedChart as shown below:\r\n\r\nLinkedCharts provides a convenient way to navigate through the levels using the <code>overlay button<\/code>. This helps immensely in maintaining context while traversing the data. There are a few more implementations of <a href=\"www.fusioncharts.com\/demos\/features\/#linkedcharts-for-easy-drill-down\" target=\"_blank\" rel=\"noopener noreferrer\">LinkedCharts in our Features Gallery<\/a>.\r\n<h2><span class=\"ez-toc-section\" id=\"What_we_will_need\"><\/span>What we will need<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n<ul>\r\n \t<li>PHP running on any server<\/li>\r\n \t<li>MySQL<\/li>\r\n \t<li><a href=\"https:\/\/www.fusioncharts.com\/download\/\/\" target=\"_blank\" rel=\"noopener noreferrer\">The latest version of FusionCharts XT<\/a><\/li>\r\n \t<li>The sample World database provided by MySQL. Read more to understand the structure of this database and how to set it up.<\/li>\r\n \t<li><a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/FusionCharts_XT_with_PHP_MySQL.zip\">The source code for the 2nd part of the series<\/a><\/li>\r\n<\/ul>\r\nOur installation process will be the same as we did in the previous article. You may use the same setup or create it as follows:\r\n<ol>\r\n \t<li>Within the root directory of your web server, create a folder named <code>FusionCharts_XT_with_PHP<\/code>. This will be our demo folder.<\/li>\r\n \t<li>Copy the entire <code>Charts<\/code> folder from the FusionCharts XT Download Package and paste it within our demo folder. This completes the installation of FusionCharts XT in our web application.<\/li>\r\n \t<li>Copy the <code>Includes<\/code> folder from <code>FusionCharts XT Download Package &gt; Code &gt; PHP &gt; Includes<\/code> to our demo folder.<\/li>\r\n \t<li>Copy the source files used in the previous article and paste them in our demo folder<\/li>\r\n<\/ol>\r\n<h2><span class=\"ez-toc-section\" id=\"Attributes_of_LinkedCharts\"><\/span>Attributes of LinkedCharts<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nWhen creating LinkedCharts, you will have to provide the data for the child charts in either Data URL or Data String formats using the <code>link<\/code> attribute.\r\n<h3><span class=\"ez-toc-section\" id=\"LinkedCharts_using_Data_URL\"><\/span>LinkedCharts using Data URL<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nIn the Data URL method, we can point to a static XML file which provides the data for this particular child. The syntax for Data URL method is:\r\n\r\nThe <code>newChart<\/code> prefix is used to indicate that it must invoke LinkedCharts. <code>xmlURL<\/code> indicates that Data URL method is used to specify XML data for the linked child charts. In case of JSON data, <code>jsonurl<\/code> is used. <code>URL<\/code> specifies the data path for the linked chart that opens when this column is clicked.\r\n\r\nSo according to the syntax, you would provide the child chart&#8217;s data in this way:\r\n<pre class=\"lang:markup\">&lt;set label='your_label' value='your_value' link='newchart-xmlurl-{xml file URL}'&gt;&lt;\/set&gt;<\/pre>\r\nWe can also point to a virtual data provider, such as a server-side script which returns <em>only<\/em> XML, with Content-type set to text\/xml:\r\n<pre class=\"lang:markup\">&lt;set label='China' value='1277558000' link='newchart-xmlurl-China.xml'&gt;&lt;\/set&gt;<\/pre>\r\n<h3><span class=\"ez-toc-section\" id=\"LinkedCharts_using_Data_String\"><\/span>LinkedCharts using Data String<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nWhen using the Data String method, the child chart&#8217;s data will have to be <em>within<\/em> the parent chart. Each data plot item in the parent chart is then linked to the child chart&#8217;s data (embedded in parent data source) by means of a unique data identifier. The syntax for Data String method is:\r\n<pre class=\"lang:markup\">&lt;set label='your_label' value='your_value' link='newchart-xml-{linked-data-ID}'&gt;&lt;\/set&gt;\r\n\t&lt;linkeddata id='your_id'&gt;\r\n\t\t&lt;chart caption='Child chart'&gt;\r\n\t\t\t{child chart data comes here}\r\n\t\t&lt;\/chart&gt;\r\n\t&lt;\/linkeddata&gt;<\/pre>\r\nAccording to this syntax, this demo&#8217;s code would have to be:\r\n<pre class=\"lang:markup\">&lt;set label='China' value='1277558000' link='newchart-xml-China'&gt;&lt;\/set&gt;\r\n\t&lt;linkeddata id='China'&gt;\r\n\t\t&lt;chart caption = 'Top 10 Most Populous Cities in China' showValues='0' useRoundEdges='1' palette='3'&gt;\r\n\t\t\t&lt;set label='Shanghai' value='9696300'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Peking' value='7472000'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Chongqing' value='6351600'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Tianjin' value='5286800'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Wuhan' value='4344600'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Harbin' value='4289800'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Shenyang' value='4265200'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Kanton [Guangzhou]' value='4256300'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Chengdu' value='3361500'&gt;&lt;\/set&gt;\r\n\t\t\t&lt;set label='Nanking [Nanjing]' value='2870300'&gt;&lt;\/set&gt;\r\n\t\t&lt;\/chart&gt;\r\n\t&lt;\/linkeddata&gt;<\/pre>\r\n<h3><span class=\"ez-toc-section\" id=\"Data_URL_or_Data_String\"><\/span>Data URL or Data String?<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nAs is apparent from the samples above, the Data URL method is more concise than the Data String method. If you have more than 1 level of drill-down, your XML string will get large, and consequently difficult to debug. Loading times for your charts might suffer too.\r\nTherefore, we recommend the Data URL method to keep your code cleaner, and charts leaner.\r\n<h2><span class=\"ez-toc-section\" id=\"Creating_LinkedCharts_using_Data_URL_method\"><\/span>Creating LinkedCharts using Data URL method<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nAs you already know from the first 3 articles, the Data URL method requires 3 things:\r\n<ol>\r\n \t<li>The parent chart (which we created in the 2nd article)<\/li>\r\n \t<li>The correct path to the data provider in the <code>link<\/code> attribute (see below)<\/li>\r\n \t<li>The data provider (see further below!)<\/li>\r\n<\/ol>\r\nMake a copy of <code>FusionChartsXT_with_PHP_and_MySQL_DataString.php<\/code> and save it as <code>FusionChartsXT_LinkedCharts_DataURL.php<\/code>. Edit the part where you create the dataplots as below:\r\n<pre class=\"lang:php\">\/\/ Append the names of the countries and their respective populations to the chart's XML string.\r\n\/\/ Provide the path to the data provider in the 'link' attribute, along with the country's name in the querystring.\r\n$strXML .= \"\";\r\n<\/pre>\r\nSave this file. Let us now create the PHP script which will provide the data for the child charts:\r\n<pre class=\"lang:php\">&lt;?php\r\n\r\n\/\/ Set the content type in the header to text\/xml.\r\nheader('Content-type: text\/xml');\r\n\r\n\/\/ Include the DBConn.php and FusionCharts.php files, so that we can access their variables and functions.\r\ninclude('Includes\/DBConn.php');\r\ninclude('Includes\/FusionCharts.php');\r\n\r\n\/\/ Retrieve the name of the country passed from the parent chart's querystring.\r\n$countryName = $_REQUEST['country'];\r\n\r\n\/\/ Use the connectToDB() function provided in DBConn.php, and establish the connection between PHP and the World database in our MySQL setup.\r\n$link = connectToDB();\r\n\r\n\/\/ Form the SQL query which returns the Top 10 Most Populous Cities of the specified country.\r\n$strQuery_cities = 'SELECT city.Name AS City, city.Population AS Population FROM city WHERE city.CountryCode = (SELECT country.Code FROM country WHERE country.Name = \"'.$countryName.'\") ORDER BY Population DESC LIMIT 10';\r\n\r\n\/\/ Execute the query, or else return the error message.\r\n$result_cities = mysql_query($strQuery_cities) or die(mysql_error());\r\n\r\n\/\/ Form the chart data's XML string.\r\n$strXML = \"\";\r\n\r\nwhile($ors_cities = mysql_fetch_array($result_cities)) {\r\n    \/\/ Iterate through the result set and append the data plots to the XML string.\r\n    $strXML .= \"\";\r\n}\r\n\r\n\/\/ Close the chart's XML string.\r\n$strXML .= \"\";  \r\n\r\n\/\/ Return the valid XML string.\r\necho $strXML;\r\n?&gt;\r\n<\/pre>\r\nSave this file as <code>FusionChartsXT_LinkedCharts_DataProvider.php<\/code>. Now navigate to the page which has the <em>parent<\/em> chart, and click on one of the columns. This is what you should see:\r\n<h2><span class=\"ez-toc-section\" id=\"Creating_LinkedCharts_using_Data_String_method\"><\/span>Creating LinkedCharts using Data String method<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nAs we&#8217;ve seen above, when using the Data String method, the child charts&#8217; data needs to be embedded within the parent chart&#8217;s data.\r\nTherefore, we need to have a single file only. Make another copy of <code>FusionChartsXT_with_PHP_and_MySQL_DataString.php<\/code> and save it as <code>FusionChartsXT_LinkedCharts_DataString.php<\/code>.\r\nNew code needs to the written only within the <code>while loop<\/code>; but we&#8217;re showing the code for the entire file below:\r\n<pre class=\"lang:php\">&lt; ?php\r\n\t\r\n\/\/ Include the DBConn.php and FusionCharts.php files, so that we can access their variables and functions.\r\ninclude('Includes\/DBConn.php');\r\ninclude('Includes\/FusionCharts.php');\r\n\r\n\/\/ Use the connectToDB() function provided in DBConn.php, and establish the connection between PHP and the World database in our MySQL setup.\r\n$link = connectToDB();\r\n\r\n\/\/ Form the SQL query which will return the Top 10 Most Populous Countries.\r\n$strQuery = 'SELECT Name AS Country, Population FROM country ORDER BY Population DESC LIMIT 10';\r\n\r\n\/\/ Execute the query, or else return the error message.\r\n$result = mysql_query($strQuery) or die(mysql_error());\r\n\r\n\/\/ If we get a valid response - \r\nif ($result) {\r\n\t\r\n\t\/\/ Create the parent chart's XML string. We can add attributes here to customize our chart.\r\n\t$strXML = \"\";\r\n\t\r\n\twhile($ors = mysql_fetch_array($result)) {\r\n\t\t\/\/ Append the names of the countries and their respective populations to the chart's XML string.\r\n\t\t\/\/ Provide the appropriate ID for the LinkedChart in the 'link' attribute.\r\n\t\t$strXML .= \"\";\r\n\t\t\r\n\t\t\/\/ Form the SQL query which returns the Top 10 Most Populous Cities for the specified country.\r\n\t\t$strQuery_cities = 'SELECT city.Name AS City, city.Population AS Population FROM city WHERE city.CountryCode = (SELECT country.Code FROM country WHERE country.Name = \"'.$ors['Country'].'\") ORDER BY Population DESC LIMIT 10';\r\n\r\n\t\t\/\/ Execute the query, or else return the error message.\r\n\t\t$result_cities = mysql_query($strQuery_cities) or die(mysql_error());\r\n\t\t\r\n\t\t\/\/ Add the unique identifier for this particular child chart.\r\n\t\t$strXML .= \"\";\r\n\t\t\r\n\t\t\/\/ Create the child chart's XML. This chart can have all the attributes as any other regular chart.\r\n\t\t$strXML .= \"\";\r\n\t\t\r\n\t\twhile($ors_cities = mysql_fetch_array($result_cities)) {\r\n\t\t\t\/\/ Append the names of the cities and their respective populations to the child chart's XML string.\r\n\t\t\t$strXML .= \"\";\r\n\t\t}\r\n\t\t\r\n\t\t\/\/ Close the child chart's XML string, and also close the unique identifier for this child chart.\r\n\t\t$strXML .= \"\";\r\n\t}\r\n}   \r\n\/\/ Close the parent chart's XML string.\r\n$strXML .= \"\";\t\r\n?&gt;\r\n\t\t\r\n&lt; !DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN\" \"https:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd\"&gt;\r\n\t\t\r\n\t\t<!-- Include FusionCharts.js to provide client-side interactivity -->\r\n        \r\n    \r\n\t\t<!-- This DIV would be our chart container --><\/pre>\r\n<div id=\"chartContainer\">\r\n        &lt; ?php \/\/ Set the rendering mode to JavaScript FC_SetRenderer(&#8216;javascript&#8217;); \/\/ Call the renderChart method, which would return the HTML and JavaScript required to generate the chart echo renderChart(&#8216;Charts\/Column2D.swf&#8217;, \/\/ Path to chart type &#8221;, \/\/ Empty string when using Data String method $strXML,\/\/ Variable which has the chart data &#8216;top10_most_populous_countries&#8217;, \/\/ Unique chart ID &#8216;660&#8217;, &#8216;400&#8217;, \/\/ Width and height in pixels false, \/\/ Disable debug mode true \/\/ Enable &#8216;Register with JavaScript&#8217; (Recommended) ); ?&gt;<\/div>\r\n&nbsp;\r\n<pre class=\"lang:php\">\r\n\r\n<\/pre>\r\nSave this file. Navigate to this page using your browser, and this is what you should see:\r\n<h2><span class=\"ez-toc-section\" id=\"Configuring_LinkedCharts\"><\/span>Configuring LinkedCharts<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nWhat we created above were <em>standard<\/em> LinkedCharts. The child charts used the same configuration and chart type as the parent chart.\r\n\r\nUsing the FusionCharts XT JavaScript API, you can configure every aspect of the child charts. For this, we&#8217;ve provided the <code>configureLink()<\/code> function. You can pass all the properties that a FusionCharts constructor accepts, as parameters to this function.\r\n\r\nThe syntax for the <code>configureLink()<\/code> is:\r\n<pre class=\"lang:php\">configureLink(objConfiguration: Object, level:Number)\r\n<\/pre>\r\nAs two separate parameters, the first parameter is an Object containing all configurations (chart and overlay-Button). The second parameter accepts a number which denotes the level being configured. The first drilldown level is 0 (zero).\r\n\r\nLet us see how we can change the child chart we created above to a <code>Area<\/code> chart. In <code>FusionChartsXT_DrillDown_DataString.php<\/code>, write the following code <em>after<\/em> the <code> echo renderChart();<\/code> line:\r\n<pre class=\"lang:javascript\">\r\n    \/\/ Specify the ID of the chart that you want to configure\r\n    FusionCharts(\"top10_most_populous_countries\").configureLink ({\r\n        swfUrl : \"Charts\/Area2D.swf\"    \/\/ Specify the chart type\r\n    }, \r\n    0 );    \/\/ The first drill-down level is 0 (zero)\r\n\r\n<\/pre>\r\nSave the file, navigate to this page, and click on one of the columns again. This is what you should see:\r\n\r\nYou can also render <a href=\"https:\/\/www.fusioncharts.com\/features\/linkedcharts-for-drill-down\" target=\"_blank\" rel=\"noopener noreferrer\">LinkedCharts in another container, or within a lightbox<\/a>. <a href=\"https:\/\/docs.fusioncharts.com\/charts\/contents\/?JavaScript\/API\/Methods.html#constructor\" target=\"_blank\" rel=\"noopener noreferrer\">Read more about such configurations<\/a> in our documentation.\r\n<h2><span class=\"ez-toc-section\" id=\"LinkedCharts_Events\"><\/span>LinkedCharts Events<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nThe FusionCharts XT JavaScript API provides a number of events when LinkedCharts are in action. Each parent chart can listen to the events and can add more functionality to the implementation. The events are as follows:\r\n<ul>\r\n \t<li><em>BeforeLinkedItemOpen<\/em>: Fires before a child chart is created<\/li>\r\n \t<li><em>LinkedItemOpened<\/em>: Fires after a child chart is created<\/li>\r\n \t<li><em>BeforeLinkItemClose<\/em>: Fires before a child chart is closed<\/li>\r\n \t<li><em>LinkedItemClosed<\/em>: Fires after a child chart is closed<\/li>\r\n<\/ul>\r\nRead more about <a href=\"https:\/\/docs.fusioncharts.com\/charts\/contents\/?JavaScript\/API\/Events.html\" target=\"_blank\" rel=\"noopener noreferrer\">Events in FusionCharts XT JavaScript API<\/a>.\r\n<h2><span class=\"ez-toc-section\" id=\"Download_the_source_code\"><\/span>Download the source code<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n<a href=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/FusionChartsXT_LinkedCharts_in_PHP.zip\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2620\" title=\"Download_Sample_Code\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png\" alt=\"\" width=\"257\" height=\"100\" srcset=\"\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png 257w, \/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3-150x58.png 150w\" sizes=\"auto, (max-width: 257px) 100vw, 257px\" \/><\/a>\r\n<h2><span class=\"ez-toc-section\" id=\"Next_in_the_series\"><\/span>Next in the series<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nIn the last part of the <em>FusionCharts XT in PHP<\/em> series, we will learn how to <a href=\"https:\/\/docs.fusioncharts.com\/charts\/contents\/?Styles\/Styles.html\" target=\"_blank\" rel=\"noopener noreferrer\">apply styles<\/a> to our charts, <a href=\"https:\/\/docs.fusioncharts.com\/charts\/contents\/?exporting-image\/ECOverview.html\" target=\"_blank\" rel=\"noopener noreferrer\">export<\/a> our charts, and <a href=\"https:\/\/docs.fusioncharts.com\/charts\/contents\/?Debug\/Basic.html\" target=\"_blank\" rel=\"noopener noreferrer\">debug<\/a> our charts. Stay tuned!","protected":false},"excerpt":{"rendered":"<p>In the 4th part of FusionCharts XT in PHP series, we will create LinkedCharts in PHP. LinkedCharts is a pioneering concept introduced by FusionCharts which allows unlimited levels of drill-down. LinkedCharts help users maintain the context when drilling down (or up) in their data. The child LinkedCharts can be configured in every way possible. Let [&hellip;]<\/p>\n","protected":false},"author":14,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[123,211,232,283],"coauthors":[715],"class_list":["post-2576","post","type-post","status-publish","format-standard","hentry","category-tutorials","tag-drill-down","tag-javascript","tag-linkedcharts","tag-php"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4<\/title>\n<meta name=\"description\" content=\"Explore line graph examples and master effective data visualization techniques. Enhance your 2026 skills with our comprehensive guide. Create graphs today.\" \/>\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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4\" \/>\n<meta property=\"og:description\" content=\"Explore line graph examples and master effective data visualization techniques. Enhance your 2026 skills with our comprehensive guide. Create graphs today.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\" \/>\n<meta property=\"og:site_name\" content=\"FusionBrew - The FusionCharts Blog\" \/>\n<meta property=\"article:published_time\" content=\"2012-03-20T14:42:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-20T09:11:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png\" \/>\n\t<meta property=\"og:image:width\" content=\"257\" \/>\n\t<meta property=\"og:image:height\" content=\"100\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"rishi\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"rishi\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#article\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\"\n\t            },\n\t            \"author\": {\n\t                \"name\": \"rishi\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/132d68250c34b957c87330353d8eaa5a\"\n\t            },\n\t            \"headline\": \"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4\",\n\t            \"datePublished\": \"2012-03-20T14:42:47+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:11:11+00:00\",\n\t            \"mainEntityOfPage\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\"\n\t            },\n\t            \"wordCount\": 1214,\n\t            \"commentCount\": 3,\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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage\"\n\t            },\n\t            \"thumbnailUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png\",\n\t            \"keywords\": [\n\t                \"drill down\",\n\t                \"javascript\",\n\t                \"linkedcharts\",\n\t                \"php\"\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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#respond\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebPage\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\",\n\t            \"name\": \"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4\",\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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage\"\n\t            },\n\t            \"thumbnailUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png\",\n\t            \"datePublished\": \"2012-03-20T14:42:47+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:11:11+00:00\",\n\t            \"description\": \"Explore line graph examples and master effective data visualization techniques. Enhance your 2026 skills with our comprehensive guide. Create graphs today.\",\n\t            \"breadcrumb\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/\"\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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage\",\n\t            \"url\": \"\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png\",\n\t            \"contentUrl\": \"\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png\",\n\t            \"width\": 257,\n\t            \"height\": 100\n\t        },\n\t        {\n\t            \"@type\": \"BreadcrumbList\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#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\": \"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4\"\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\/132d68250c34b957c87330353d8eaa5a\",\n\t            \"name\": \"rishi\",\n\t            \"image\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/328482cd2c44c22cbfaf38e6113a8a24\",\n\t                \"url\": \"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g\",\n\t                \"contentUrl\": \"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g\",\n\t                \"caption\": \"rishi\"\n\t            },\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/author\/rishi\/\"\n\t        }\n\t    ]\n\t}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4","description":"Explore line graph examples and master effective data visualization techniques. Enhance your 2026 skills with our comprehensive guide. Create graphs today.","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\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/","og_locale":"en_US","og_type":"article","og_title":"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4","og_description":"Explore line graph examples and master effective data visualization techniques. Enhance your 2026 skills with our comprehensive guide. Create graphs today.","og_url":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/","og_site_name":"FusionBrew - The FusionCharts Blog","article_published_time":"2012-03-20T14:42:47+00:00","article_modified_time":"2026-01-20T09:11:11+00:00","og_image":[{"width":257,"height":100,"url":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png","type":"image\/png"}],"author":"rishi","twitter_card":"summary_large_image","twitter_misc":{"Written by":"rishi","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#article","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/"},"author":{"name":"rishi","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/132d68250c34b957c87330353d8eaa5a"},"headline":"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4","datePublished":"2012-03-20T14:42:47+00:00","dateModified":"2026-01-20T09:11:11+00:00","mainEntityOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/"},"wordCount":1214,"commentCount":3,"publisher":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png","keywords":["drill down","javascript","linkedcharts","php"],"articleSection":["Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/","url":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/","name":"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png","datePublished":"2012-03-20T14:42:47+00:00","dateModified":"2026-01-20T09:11:11+00:00","description":"Explore line graph examples and master effective data visualization techniques. Enhance your 2026 skills with our comprehensive guide. Create graphs today.","breadcrumb":{"@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#primaryimage","url":"\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png","contentUrl":"\/blog\/wp-content\/uploads\/2012\/03\/Download_Sample_Code3.png","width":257,"height":100},{"@type":"BreadcrumbList","@id":"https:\/\/www.fusioncharts.com\/blog\/javascript-linkedcharts-in-php-and-mysql-using-fusioncharts-xt\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.fusioncharts.com\/blog\/"},{"@type":"ListItem","position":2,"name":"JS LinkedCharts in PHP &amp; MySQL Using FusionCharts XT: Part 4"}]},{"@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\/132d68250c34b957c87330353d8eaa5a","name":"rishi","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/328482cd2c44c22cbfaf38e6113a8a24","url":"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g","caption":"rishi"},"url":"https:\/\/www.fusioncharts.com\/blog\/author\/rishi\/"}]}},"_links":{"self":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/2576","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\/14"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/comments?post=2576"}],"version-history":[{"count":0,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/2576\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/media?parent=2576"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/categories?post=2576"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/tags?post=2576"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/coauthors?post=2576"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}