sarvari Report post Posted October 31, 2012 this is my HTML document named weekly-sales. <html> <head> <title>SARVARI</title> <script type="text/javascript" src="FusionCharts/FusionCharts.js"> </script> </head> <body> <div id="chartContainer">FusionCharts XT will load here!</div> <div id="childChartContainer" ></div> <script type="text/javascript"> FusionCharts.setCurrentRenderer('javascript'); var myChart = new FusionCharts( "FusionCharts/Doughnut2D.swf","myChartId", "650", "650", "0", "1"); myChart.setJSONUrl("Dou1.json"); myChart.render("chartContainer"); myChart.configureLink ( [ { swfUrl: 'FusionCharts/Bar2D.swf', width: '350', height: '350', renderAt: 'childChartContainer', insertMode: 'append', overlayButton: {message: 'Close' } } ] ); </script> </body> </html> and this is my JSON document: "Dou1.json" { "chart": { "showlegend": "1", "showlabels": "0", "showvalues": "0", "issmartlineslanted": "0", "numberprefix": "$", "plotbordercolor": "FFFFFF", "showpercentagevalues": "0", "bgcolor": "FFFFFF,CCCCCC", "caption": "Spend by Categories" }, "data": [ { "alpha": "60", "color": "99CC00", "label": "Food", "value": "212000", "link":"newchart-json-bar1" }, { "alpha": "60", "color": "333333", "label": "Entertaiment", "value": "96800", "link":"newchart-json-bar2" }, { "alpha": "30", "color": "99CC00", "label": "Sales", "value": "26400", "link":"newchart-json-bar3" }, { "alpha": "30", "color": "333333", "label": "Others", "value": "29300", "link":"newchart-json-bar4" } ], "linkeddata":[ { "id":"bar1", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "JohnSmith", "value": "100.00" }, { "color": "F6BD0F", "label": "AnnaSmith", "value": "405.00" }, { "color": "8BBA00", "label": "Kevin Brown", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } }, { "id":"bar2", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "Smith", "value": "100.00" }, { "color": "F6BD0F", "label": "Smith", "value": "405.00" }, { "color": "8BBA00", "label": "Brown", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } }, { "id":"bar3", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "John", "value": "100.00" }, { "color": "F6BD0F", "label": "Anna", "value": "405.00" }, { "color": "8BBA00", "label": "Kevin", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } }, { "id":"bar4", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "JS", "value": "100.00" }, { "color": "F6BD0F", "label": "AS", "value": "405.00" }, { "color": "8BBA00", "label": "KB", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } } ] } the main chart was displaying but when we click on the mainchart the child chart was not displaying.i am attaching the screen shot of it.can anyoone plz help me how to make child chart display.thanks in advance. Share this post Link to post Share on other sites
martinc Report post Posted November 1, 2012 try to change "linkedcharts" to "linkedchart" - see other post in this forum about this problem this is my HTML document named weekly-sales. <html> <head> <title>SARVARI</title> <script type="text/javascript" src="FusionCharts/FusionCharts.js"> </script> </head> <body> <div id="chartContainer">FusionCharts XT will load here!</div> <div id="childChartContainer" ></div> <script type="text/javascript"> FusionCharts.setCurrentRenderer('javascript'); var myChart = new FusionCharts( "FusionCharts/Doughnut2D.swf","myChartId", "650", "650", "0", "1"); myChart.setJSONUrl("Dou1.json"); myChart.render("chartContainer"); myChart.configureLink ( [ { swfUrl: 'FusionCharts/Bar2D.swf', width: '350', height: '350', renderAt: 'childChartContainer', insertMode: 'append', overlayButton: {message: 'Close' } } ] ); </script> </body> </html> and this is my JSON document: "Dou1.json" { "chart": { "showlegend": "1", "showlabels": "0", "showvalues": "0", "issmartlineslanted": "0", "numberprefix": "{:content:}quot;, "plotbordercolor": "FFFFFF", "showpercentagevalues": "0", "bgcolor": "FFFFFF,CCCCCC", "caption": "Spend by Categories" }, "data": [ { "alpha": "60", "color": "99CC00", "label": "Food", "value": "212000", "link":"newchart-json-bar1" }, { "alpha": "60", "color": "333333", "label": "Entertaiment", "value": "96800", "link":"newchart-json-bar2" }, { "alpha": "30", "color": "99CC00", "label": "Sales", "value": "26400", "link":"newchart-json-bar3" }, { "alpha": "30", "color": "333333", "label": "Others", "value": "29300", "link":"newchart-json-bar4" } ], "linkeddata":[ { "id":"bar1", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "JohnSmith", "value": "100.00" }, { "color": "F6BD0F", "label": "AnnaSmith", "value": "405.00" }, { "color": "8BBA00", "label": "Kevin Brown", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } }, { "id":"bar2", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "Smith", "value": "100.00" }, { "color": "F6BD0F", "label": "Smith", "value": "405.00" }, { "color": "8BBA00", "label": "Brown", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } }, { "id":"bar3", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "John", "value": "100.00" }, { "color": "F6BD0F", "label": "Anna", "value": "405.00" }, { "color": "8BBA00", "label": "Kevin", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } }, { "id":"bar4", "linkedcharts":{ "chart": { "bgcolor": "FFFFFF,FFFFFF", "caption": "Activity by Card", "useroundedges": "1", "tooltipbgcolor": "E7EFF6", "tooltipbordercolor": "114B78", "basefontcolor": "114B78", "alternatevgridcolor": "AFD8F8", "subcaption": "(supp)" }, "data": [ { "color": "AFD8F8", "label": "JS", "value": "100.00" }, { "color": "F6BD0F", "label": "AS", "value": "405.00" }, { "color": "8BBA00", "label": "KB", "value": "210.00" }, { "color": "A66EDD", "label": "All Others", "value": "75.00" } ] } } ] } the main chart was displaying but when we click on the mainchart the child chart was not displaying.i am attaching the screen shot of it.can anyoone plz help me how to make child chart display.thanks in advance. Share this post Link to post Share on other sites
Guest Sumedh Report post Posted November 2, 2012 Hi, A warm welcome to FusionCharts Forum! Please try using "linkedchart" keyword instead "linkedcharts". Please find attached illustration for your reference. Hope this helps! LinkedChart_Test.zip Share this post Link to post Share on other sites
sarvari Report post Posted November 3, 2012 thank u so much..the problem was solved.. Hi, A warm welcome to FusionCharts Forum! Please try using "linkedchart" keyword instead "linkedcharts". Please find attached illustration for your reference. Hope this helps! Share this post Link to post Share on other sites