Problem in displaying different chart types using drilldown in fusionchartsXT

[vicky07]

I want to display the parent chart in bar2d and the child chart in pie2d. But both the parent and child charts are rendered in the same type. Also I used configureLink() method to specify my child chart type. But it is throwing an error like 'str' object has no attribute 'configure link'. I am using Django. The code that I have tried is:

Views.py

def drilldown(request):
    drilldownobj = FusionCharts(
         'column2d',
         'chart-container',
         '600',
         '400',
         'drilldown-chart',
         'json',
        {"chart": {
        "caption": "North American Population",
        "subcaption": "USA & Canada",
        "xaxisname": "Country (Click to drill down)",
        "theme": "fusion"
      },
      "data": [
        {
          "label": "United States",
          "value": "310380000",
          "link": "newchart-json-usa"
        },
        {
          "label": "Canada",
          "value": "34020000",
          "link": "newchart-json-can"
        }
      ],
      "linkeddata": [
        {
          "id": "usa",
          "linkedchart":{
            "chart": {
              "caption": "Population by Religion",
              "subcaption": "USA",
              "showpercentintooltip": "1",
              "enablemultislicing": "0",
              "startingangle": "90",
              "theme": "fusion"
            },
            "data": [
              {
                "label": "Christian",
                "value": "78.30"
              },
              {
                "label": "Muslim",
                "value": "0.90 "
              },
              {
                "label": "Hindu",
                "value": ".60"
              },
              {
                "label": "Buddhist",
                "value": "1.20"
              },
              {
                "label": "Jewish",
                "value": "1.80"
              },
              {
                "label": "Others",
                "value": "17.20"
              }
            ]
          }
        },
        {
          "id": "can",
          # "type":"pie2d",
          "linkedchart": {
            "chart": {
              "caption": "Population by Religion",
              "subcaption": "Canada",
              "showpercentintooltip": "1",
              "startingangle": "90",
              "theme": "fusion"
            },
            "data": [
              {
                "label": "Christian",
                "value": "72"
              },
              {
                "label": "Muslim",
                "value": "2.1"
              },
              {
                "label": "Hindu",
                "value": "1.4"
              },
              {
                "label": "Buddhist",
                "value": ".8"
              },
              {
                "label": "Jewish",
                "value": "1.72"
              },
              {
                "label": "Others",
                "value": "24.70"
              }
            ]
          }
        }
      ]
    }).render()
    drilldownobj.configureLink({
        type: "pie2d",
        overlayButton: {
            message: 'Back to parent chart',
            bgColor: '#999999',
            borderColor: '#cccccc'
        }
    }).render()

    drilldown_dict ={'drilldown':drilldownobj}
    return render(request, 'drilldown.html',context=drilldown_dict)

 

.html:

{% extends "base.html" %}
{% block body %}
<section class="content-header">
  <h1><strong>drilldown</strong></h1>
  <br>
  <div class="row">
    <div class="col-md-6">
      <div id="drilldown-chart">{{ drilldown|safe }}</div>
    </div>
{% endblock %}

Please help me to resolve this.

Thanks

[Akash Biswas]

Hi Vicky,

 

The API method "configureLink()" is not used properly. It does not need the render() method to be invoked with the configureLink() as in the provided snippet.

Please use it as below :

drilldownobj.configureLink({
        type: "pie2d",
        overlayButton: {
            message: 'Back to parent chart',
            bgColor: '#999999',
            borderColor: '#cccccc'
        }
    });

You can also refer to a sample fiddle : http://jsfiddle.net/fusioncharts/zdewk96j/

Please find the configureLink() API method reference in the list : https://www.fusioncharts.com/dev/api/fusioncharts/fusioncharts-methods

 

Thanks,

Akash.