Render map when click on Chart plot. Fusioncharts

[BetoDev]

I want to render a Map using Fusioncharts when click on some plot in other Chart, so far i can not achieve this, how could i do that? I have the following code:

In code behind C#

Function that i want to display when click on other chart:

[System.Web.Services.WebMethod()]
        [System.Web.Script.Services.ScriptMethod()]
        public static void GraficaMundial(int id)
        { //some code here
            Chart sales = new Chart();

            // Setting chart id
            //sales.SetChartParameter(Chart.ChartParameter.chartId, "myChart3");

            // Setting chart type to world chart
            sales.SetChartParameter(Chart.ChartParameter.chartType, "worldwithcountries");

            // Setting chart width to 600px
            sales.SetChartParameter(Chart.ChartParameter.chartWidth, "100%");

            // Setting chart height to 350px
            sales.SetChartParameter(Chart.ChartParameter.chartHeight, "550");
            sales.SetChartParameter(Chart.ChartParameter.dataFormat, "json");
            sales.SetChartParameter(Chart.ChartParameter.dataSource, jsonData.ToString());

            var LtGraficoPaises = new Literal();

            LtGraficoPaises.Text = sales.Render();
          }

   Code of the Chart that I would like the map to display
 

      private void GraficaEjecutivo()
        { //some code here

                StaticSource source = new StaticSource(chart);
                FusionCharts.DataEngine.DataModel model = new DataModel();
                model.DataSources.Add(source);
                var bar = new Charts.BarChart("scroll_chart_db");
                //bar.Scrollable = true;
                bar.ThemeName = FusionChartsTheme.ThemeName.FUSION;
                bar.Data.Source = model;
                bar.Caption.Text = "RFQ Totales por Ejecutivo";
                bar.SubCaption.Text = "2016-2017";
                bar.XAxis.Text = "Ejecutivos";
                bar.YAxis.Text = "Clientes";
                bar.Width.Percentage(100);
                bar.Height.Pixel(400);
                var funcion = @"function(eventObj, dataObj){

                document.getElementById('GraficoPaises').innerHTML =  PageMethods.GraficaMundial(1);
                    }";
                bar.Events.AttachGenericEvents(FusionChartsEvents.GenericEvents.DATAPLOTCLICK, funcion.ToString());

                LtGraficoPorEjecutivo.Text = bar.Render();
        }

In .aspx

Literal that render the Map

<div class="col-sm-12 text-center" id="GraficoPaises">
                        <asp:Literal ID="LtGraficoPaises" runat="server">
                        </asp:Literal>
</div>

I did tests, and when i click on the bar of my chart (GraficaEjecutivo method) the event is working propertly, but im not be able to display or render my map.

What im doing wrong? I hope you can help me.

[Akash Biswas]

Hi,

 

To render maps on clicking the data plots of a chart, please check this sample for reference : http://jsfiddle.net/ex9y8vqa/1/

Also you can refer to the below sample link for the implementation code for the similar functionality in various technology stacks :

https://www.fusioncharts.com/fusionmaps/features/drill-down-from-map-to-chart

 

Thanks,

Akash.

[BetoDev]

There is a way of do this in C# code behind? 

[BetoDev]

Im trying to do this in c# but when i want to use configureLink i have the following error:

Uncaught TypeError: GraficaEjecutivos.configureLink is not a function

where GraficaEjecutivos is my id for my chart

MyFirstChart = new Chart("bar2d", "GraficaEjecutivos", "100%", "550", "json", jsonData.ToString());
 
          //Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "funcion", "MyFirstChart", true);
          var funcion = @"generarMapa = function (e) {
                          console.log(e.data.dataIndex);
                          //let chart = '<%=MyFirstChart%>';
                          maptype = (e.data.categoryLabel).toLowerCase();
                          GraficaEjecutivos.configureLink({
                          renderAt: 'child-chart-container',
                          type: maptype
                          });
                      }";
          MyFirstChart.AddEvent("dataplotClick", funcion.ToString());

 

[Akash Biswas]

Hi,

 

Yes, you can use the FusionCharts ASP.NET wrapper to render charts.

Please find the below sample for Rendering chart in Windows form application using C# :

https://www.dropbox.com/s/h0jfk48jlhbqjuk/Demo FusionCharts in windowsapplication in c%23.zip?dl=0

 

Thanks,

Akash.