You are viewing documentation for an older version. For current documentation - click here.
Full Chart as a hotspot

Starting FusionWidgets XT, you can also set the full chart as a single hotspot. This is useful, when you want to show a small thumbnail of the chart, which when clicked opens a detailed bigger chart.

To set the entire chart as a hotspot, just specify the target link in the clickURL attribute of <chart> element as under:

<chart ... clickURL='DetailedChart.html' ...>

You can again specify the link in five ways:

  1. Simple link opening in same window
  2. Simple link opening in new window
  3. Link to another frame
  4. Link opening in a new pop-up window
  5. Existing JavaScript functions (on the same page) to be invoked as links

If you set the entire chart as hotspot, the other links on the chart (individual links for data plot) will not work.

Example XML/JSON:

 
<chart caption='chart caption' subcaption='' xAxisName='' yAxisName='' numberPrefix='' 
clickURL='n-http://www.fusioncharts.com'>
         <set label='Jan' value='17400' />
         <set label='Feb' value='19800' />
         <set label='Mar' value='21800' />
         <set label='Apr' value='23800' />
         <set label='May' value='29600' />
         <set label='Jun' value='27600' />
</chart>
{
  "chart": {
    "caption": "chart caption",
    "subcaption": "",
    "xaxisname": "",
    "yaxisname": "",
    "numberprefix": "",
    "clickurl": "n-http://www.fusioncharts.com"
  },
  "data": [
    {
      "label": "Jan",
      "value": "17400"
    },
    {
      "label": "Feb",
      "value": "19800"
    },
    {
      "label": "Mar",
      "value": "21800"
    },
    {
      "label": "Apr",
      "value": "23800"
    },
    {
      "label": "May",
      "value": "29600"
    },
    {
      "label": "Jun",
      "value": "27600"
    }
  ]
}

See it live!

Note: Internally the chart decodes a URL that you set as link. Before invoking the link it again encodes the URL. If you are passing multilingual characters via a URL or do not want this decode-encode mechanism to be handled by chart you can set unescapeLinks='0' in <chart> element of the chart's XML data. If you are using JSON data, you need to use { "chart" : { "unescapeLinks" : "0" ... } ... } .