The Interactive chart widget is similar to the embedded widget but allows much
more user customization. This is a premium widget and requires your account to
be configured for premium access.
Below is a sample Interactive chart:
Installing the Interactive Chart Scripts
Add the following
<script> tags to your web page <header> or just below the <body> tag :
Showing the Chart (Method 1 - Inline)
var chart = new BFCChart("bfcChart",501, 660, 500);
In the above code a new chart object is created and inserted into the html document at the point in which the script is placed.
The parameters for the BFCChart constructor are:
- controlID - The Element ID of the Chart Control. Must be unique on the html page
- pubId - Your publisher ID. Assigned to you when you create an account.
- chartWidth - the width of the chart. Can specify pixels or percent
- chartHeight - the height of the chart. Cane specify pixels or percent
Showing the Chart (Method 2 - Specifying a Container)
The second method for adding an interactive Chart widget to your web page is to
designate a host element for the control. This can be any valid html element
(examples: <div>, <span>,<p>,<td>). Consider the following html fragment:
<p> StockMarket Charts Inc interactive chart demo</p>
<p> The Real-time chart above is provided by FreeStockCharts.com</p>
var chart = new BFCChart("bfcChart",501, 800, 500);
chart.targetElement = 'bfcHostDiv';
In the above code a div with the id bfcHostDiv is the location in the
document where the chart widget will appear. In the script block the second line
of code: chart.targetElement = 'bfcHostDiv'; instructs the
widget to be created inside the div with the id bfcHostDiv.This allows
the position where the chart should appear.
Once created, there are a number of custom properties, functions and events that
can be called on the Interactive chart widget. View the
properties and methods