├── samples
├── pages
│ ├── data
│ │ ├── data.json
│ │ └── data.xml
│ ├── chart-from-xml-url.php
│ ├── chart-from-json-url.php
│ ├── drilldown.php
│ ├── Adding-Reference-Line.php
│ ├── ColumnChart-With-Time-Axis.php
│ ├── AreaChart-With-Time-Axis.php
│ ├── Line-Chart-With-Time-Axis.php
│ ├── Interactive-candlestick-chart.php
│ ├── Plotting-Multiple-Series-On-Time-Axis.php
│ ├── Column-and-line-combination-on-time-axis.php
│ ├── Plotting-Two-Variables.php
│ ├── Different-Plot-Type-Chart.php
│ ├── chart-special-char.php
│ ├── pie3d-chart-sample.php
│ ├── Date-range-event-overlay.php
│ ├── angular-gauge-sample.php
│ ├── simple-chart.php
│ ├── simple-gauge.php
│ ├── product-life-cycle-event.php
│ ├── chart-message.php
│ ├── chart-database.php
│ ├── number-format.php
│ ├── special-event.php
│ ├── update-data-runtime.php
│ ├── interactive-event.php
│ ├── simple-map.php
│ ├── drilldown-data-handler.php
│ ├── different-language.php
│ ├── Single-Event-Overlay.php
│ ├── mscolumn2d-sample.php
│ ├── chart-annotation.php
│ ├── highlight-specific-data-points.php
│ ├── customizing-tooltip.php
│ ├── dynamic-chart-type.php
│ ├── dynamic-chart-resize.php
│ ├── stacked-column2d-line-chart-sample.php
│ ├── special-chart-type-api.php
│ ├── Annotating-single-data-point.php
│ ├── chart-product-level-api.php
│ ├── updating-chart-properties.php
│ ├── chart-export-at-client.php
│ ├── chart-export-at-server.php
│ ├── chart-instance-level-api.php
│ ├── mscombi3d-chart-sample.php
│ ├── chart-themes.php
│ ├── updating-different-chart.php
│ └── usa-map-sample.php
├── index.php
└── includes
│ └── fusioncharts.php
├── LICENSE.md
└── fusioncharts-wrapper
└── fusioncharts.php
/samples/pages/data/data.json:
--------------------------------------------------------------------------------
1 | {
2 | "chart": {
3 | "caption": "Monthly revenue for last year",
4 | "subCaption": "Harry's SuperMart",
5 | "xAxisName": "Month",
6 | "yAxisName": "Revenues (In USD)",
7 | "numberPrefix": "$",
8 | "theme": "fusion"
9 | },
10 | "data": [
11 | {"label": "Jan", "value": "420000"},
12 | {"label": "Feb", "value": "810000"},
13 | {"label": "Mar", "value": "720000"},
14 | {"label": "Apr", "value": "550000"},
15 | {"label": "May", "value": "910000"},
16 | {"label": "Jun", "value": "510000"},
17 | {"label": "Jul", "value": "680000"},
18 | {"label": "Aug", "value": "620000"},
19 | {"label": "Sep", "value": "610000"},
20 | {"label": "Oct", "value": "490000"},
21 | {"label": "Nov", "value": "900000"},
22 | {"label": "Dec", "value": "730000"}
23 | ]
24 | }
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2020 FusionCharts, Inc.
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/samples/pages/data/data.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/samples/pages/chart-from-xml-url.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Chart using data from XML URL
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
30 |
31 | ?>
32 | Chart using data from XML URL
33 | Chart will render here!
34 |
35 |
36 | Go Back
37 |
38 |
39 |
--------------------------------------------------------------------------------
/samples/pages/chart-from-json-url.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Chart using data from JSON URL
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
30 |
31 | ?>
32 | Chart using data from JSON URL
33 | Chart will render here!
34 |
35 |
36 | Go Back
37 |
38 |
39 |
--------------------------------------------------------------------------------
/samples/pages/drilldown.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | DrillDown Chart
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
29 |
30 | ?>
31 | Chart with Drill-Down Feature
32 | Chart will render here!
33 |
34 |
35 | Go Back
36 |
37 |
38 |
--------------------------------------------------------------------------------
/samples/pages/Adding-Reference-Line.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
26 | text: 'Temperature readings in Italy'
27 | }");
28 |
29 | $timeSeries->AddAttribute("yAxis", "[{
30 | plot: 'Temperature',
31 | title: 'Temperature',
32 | format:{
33 | suffix: '°C',
34 | },
35 | referenceLine: [{
36 | label: 'Controlled Temperature',
37 | value: '10'
38 | }]
39 | }]");
40 |
41 | // chart object
42 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
43 |
44 | // Render the chart
45 | $Chart->render();
46 |
47 | ?>
48 |
49 | Adding a reference line
50 | Chart will render here!
51 |
52 |
53 | Go Back
54 |
55 |
56 |
--------------------------------------------------------------------------------
/samples/pages/ColumnChart-With-Time-Axis.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("chart", "{
25 | showLegend: 0
26 | }");
27 |
28 | $timeSeries->AddAttribute("caption", "{
29 | text: 'Daily Visitors Count of a Website'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: {
34 | value: 'Daily Visitors',
35 | type: 'column'
36 | },
37 | title: 'Daily Visitors (in thousand)'
38 | }]");
39 |
40 | // chart object
41 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
42 |
43 | // Render the chart
44 | $Chart->render();
45 |
46 | ?>
47 |
48 | Column chart with time axis
49 | Chart will render here!
50 |
51 |
52 | Go Back
53 |
54 |
55 |
--------------------------------------------------------------------------------
/samples/pages/AreaChart-With-Time-Axis.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("chart", "{
25 | showLegend: 0
26 | }");
27 |
28 | $timeSeries->AddAttribute("caption", "{
29 | text: 'Daily Visitors Count of a Website'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: {
34 | value: 'Daily Visitors',
35 | type: 'area'
36 | },
37 | title: 'Daily Visitors (in thousand)'
38 | }]");
39 |
40 | // chart object
41 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
42 |
43 | // Render the chart
44 | $Chart->render();
45 |
46 | ?>
47 |
48 | Area chart with time axis
49 | Chart will render here!
50 |
51 |
52 | Go Back
53 |
54 |
55 |
--------------------------------------------------------------------------------
/samples/pages/Line-Chart-With-Time-Axis.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Sales Analysis'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subcaption", "{
29 | text: 'Grocery'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: {
34 | value: 'Grocery Sales Value',
35 | type: 'line'
36 | },
37 | format: {
38 | prefix: '$'
39 | },
40 | title: 'Sale Value'
41 | }]");
42 |
43 | // chart object
44 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
45 |
46 | // Render the chart
47 | $Chart->render();
48 |
49 | ?>
50 |
51 | Line chart with time axis
52 | Chart will render here!
53 |
54 |
55 | Go Back
56 |
57 |
58 |
--------------------------------------------------------------------------------
/samples/pages/Interactive-candlestick-chart.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Apple Inc. Stock Price'
26 | }");
27 |
28 | $timeSeries->AddAttribute("yAxis", "[{
29 | plot: {
30 | value: {
31 | open: 'Open',
32 | high: 'High',
33 | low: 'Low',
34 | close: 'Close'
35 | },
36 | type: 'candlestick'
37 | },
38 | format: {
39 | prefix: '$'
40 | },
41 | title: 'Stock Value'
42 | }]");
43 |
44 | // chart object
45 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
46 |
47 | // Render the chart
48 | $Chart->render();
49 |
50 | ?>
51 |
52 | Interactive candlestick chart
53 | Chart will render here!
54 |
55 |
56 | Go Back
57 |
58 |
59 |
--------------------------------------------------------------------------------
/samples/pages/Plotting-Multiple-Series-On-Time-Axis.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Sales Analysis'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subcaption", "{
29 | text: 'Grocery & Footwear'
30 | }");
31 |
32 | $timeSeries->AddAttribute("series", "'Type'");
33 |
34 | $timeSeries->AddAttribute("yAxis", " [{
35 | plot: 'Sales Value',
36 | title: 'Sale Value',
37 | format: {
38 | prefix: '$'
39 | }
40 | }]");
41 |
42 | // chart object
43 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
44 |
45 | // Render the chart
46 | $Chart->render();
47 |
48 | ?>
49 |
50 | Plotting multiple series on time axis
51 | Chart will render here!
52 |
53 |
54 | Go Back
55 |
56 |
57 |
--------------------------------------------------------------------------------
/samples/pages/Column-and-line-combination-on-time-axis.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Web visits & downloads'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subcaption", "{
29 | text: 'since 2015'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: [{
34 | value: 'Downloads',
35 | type: 'column'
36 | }, {
37 | value: 'Web Visits',
38 | type: 'line'
39 | }]
40 | }]");
41 |
42 | // chart object
43 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
44 |
45 | // Render the chart
46 | $Chart->render();
47 |
48 | ?>
49 |
50 | Column and line combination on time axis
51 | Chart will render here!
52 |
53 |
54 | Go Back
55 |
56 |
57 |
--------------------------------------------------------------------------------
/samples/pages/Plotting-Two-Variables.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Cariaco Basin Sampling'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subcaption", "{
29 | text: 'Analysis of O₂ Concentration and Surface Temperature'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: [{
34 | value: 'O2 concentration',
35 | connectNullData: true
36 | }],
37 | min: '3',
38 | max: '6',
39 | title: 'O₂ Concentration (mg/L)'
40 | }, {
41 | plot: [{
42 | value: 'Surface Temperature',
43 | connectNullData: true
44 | }],
45 | min: '18',
46 | max: '30',
47 | title: 'Surface Temperature (°C)'
48 | }]");
49 |
50 | // chart object
51 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
52 |
53 | // Render the chart
54 | $Chart->render();
55 |
56 | ?>
57 |
58 | Plotting two variables (measures)
59 | Chart will render here!
60 |
61 |
62 | Go Back
63 |
64 |
65 |
--------------------------------------------------------------------------------
/samples/pages/Different-Plot-Type-Chart.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FuionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Sales Performance'
26 | }");
27 |
28 | $timeSeries->AddAttribute("yAxis", "[{
29 | plot: {
30 | value: 'Sale Amount',
31 | type: 'area'
32 | },
33 | title: 'Sale Amount',
34 | format: {
35 | prefix: '$'
36 | }
37 | }, {
38 | plot: {
39 | value: 'Units Sold',
40 | type: 'column'
41 | },
42 | title: 'Units Sold'
43 | }]");
44 |
45 | // chart object
46 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
47 |
48 | // Render the chart
49 | $Chart->render();
50 |
51 | ?>
52 |
53 | Different plot type for each variable (measure)
54 | Chart will render here!
55 |
56 |
57 | Go Back
58 |
59 |
60 |
--------------------------------------------------------------------------------
/samples/pages/chart-special-char.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | ";
25 | $xmlData .= "";
26 | $xmlData .= "";
27 | $xmlData .= "";
28 | $xmlData .= "";
29 | $xmlData .= "";
30 | $xmlData .= "";
31 | $xmlData .= "";
32 | $xmlData .= "";
33 | $xmlData .= "";
34 | $xmlData .= "";
35 | $xmlData .= "";
36 | $xmlData .= "";
37 | $xmlData .= "";
38 |
39 | // chart object
40 | $Chart = new FusionCharts("column2d", "chart-1" , "600", "400", "chart-container", "xml", $xmlData);
41 |
42 | // Render the chart
43 | $Chart->render();
44 |
45 | ?>
46 | Chart using special character in XML data format
47 | Chart will render here!
48 |
49 |
50 | Go Back
51 |
52 |
53 |
54 |
--------------------------------------------------------------------------------
/samples/pages/pie3d-chart-sample.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Pie 3D Chart
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
57 |
58 | ?>
59 | Pie 3D Chart
60 | Chart will render here!
61 |
62 |
63 | Go Back
64 |
65 |
66 |
--------------------------------------------------------------------------------
/samples/pages/Date-range-event-overlay.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Interest Rate Analysis'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subCaption", "{
29 | text: 'Federal Reserve (USA)'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: 'Interest Rate',
34 | format:{
35 | suffix: '%'
36 | },
37 | title: 'Interest Rate'
38 | }]");
39 |
40 | $timeSeries->AddAttribute("xAxis", "{
41 | plot: 'Time',
42 | timemarker: [{
43 | start: 'Jul-1981',
44 | end: 'Nov-1982',
45 | label: 'Economic downturn was triggered by {br} tight monetary policy in an effort to {br} fight mounting inflation.',
46 | timeFormat: '%b-%Y'
47 | }, {
48 | start: 'Jul-1990',
49 | end: 'Mar-1991',
50 | label: 'This eight month recession period {br} was characterized by a sluggish employment recovery, {br} most commonly referred to as a jobless recovery.',
51 | timeFormat: '%b-%Y'
52 | }, {
53 | start: 'Jun-2004',
54 | end: 'Jul-2006',
55 | label: 'The Fed after raising interest rates {br} at 17 consecutive meetings, ends its campaign {br} to slow the economy and forestall inflation.',
56 | timeFormat: '%b-%Y'
57 | }, {
58 | start: 'Dec-2007',
59 | end: 'Jun-2009',
60 | label: 'Recession caused by the worst {br} collapse of financial system in recent {br} times.',
61 | timeFormat: '%b-%Y'
62 | }]
63 | }");
64 |
65 | // chart object
66 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
67 |
68 | // Render the chart
69 | $Chart->render();
70 |
71 | ?>
72 |
73 | Date range event overlay
74 | Chart will render here!
75 |
76 |
77 | Go Back
78 |
79 |
80 |
--------------------------------------------------------------------------------
/samples/pages/angular-gauge-sample.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Angular Gauge
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
61 |
62 | ?>
63 | Angular Gauge
64 | Chart will render here!
65 |
66 |
67 | Go Back
68 |
69 |
70 |
--------------------------------------------------------------------------------
/samples/pages/simple-chart.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple Chart Using Array
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | array(
26 | "caption" => "Countries With Most Oil Reserves [2017-18]",
27 | "subCaption" => "In MMbbl = One Million barrels",
28 | "xAxisName" => "Country",
29 | "yAxisName" => "Reserves (MMbbl)",
30 | "numberSuffix" => "K",
31 | "theme" => "fusion"
32 | )
33 | );
34 |
35 | // An array of hash objects which stores data
36 | $arrChartData = array(
37 | ["Venezuela", "290"],
38 | ["Saudi", "260"],
39 | ["Canada", "180"],
40 | ["Iran", "140"],
41 | ["Russia", "115"],
42 | ["UAE", "100"],
43 | ["US", "30"],
44 | ["China", "30"]
45 | );
46 |
47 | $arrLabelValueData = array();
48 |
49 | // Pushing labels and values
50 | for($i = 0; $i < count($arrChartData); $i++) {
51 | array_push($arrLabelValueData, array(
52 | "label" => $arrChartData[$i][0], "value" => $arrChartData[$i][1]
53 | ));
54 | }
55 |
56 | $arrChartConfig["data"] = $arrLabelValueData;
57 |
58 | // JSON Encode the data to retrieve the string containing the JSON representation of the data in the array.
59 | $jsonEncodedData = json_encode($arrChartConfig);
60 |
61 | // chart object
62 | $Chart = new FusionCharts("column2d", "MyFirstChart" , "600", "350", "chart-container", "json", $jsonEncodedData);
63 |
64 | // Render the chart
65 | $Chart->render();
66 |
67 | ?>
68 |
69 | Simple Chart Using Array
70 | Chart will render here!
71 |
72 |
73 | Go Back
74 |
75 |
76 |
--------------------------------------------------------------------------------
/samples/pages/simple-gauge.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple Widget Using Array
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | array(
27 | "caption" => "Nordstorm's Customer Satisfaction Score for 2017",
28 | "lowerLimit" => "0",
29 | "upperLimit" => "100",
30 | "showValue" => "1",
31 | "numberSuffix" => "%",
32 | "theme" => "fusion",
33 | "showToolTip" => "0"
34 | )
35 | );
36 |
37 | // Widget color range data
38 | $colorDataObj = array("color" => array(
39 | ["minValue" => "0", "maxValue" => "50", "code" => "#F2726F"],
40 | ["minValue" => "50", "maxValue" => "75", "code" => "#FFC533"],
41 | ["minValue" => "75", "maxValue" => "100", "code" => "#62B58F"]
42 | ));
43 |
44 | // Dial array
45 | $dial = array();
46 |
47 | // Widget dial data in array format, multiple values can be separated by comma e.g. ["81", "23", "45",...]
48 | $widgetDialDataArray = array("81");
49 | for($i = 0; $i < count($widgetDialDataArray); $i++) {
50 | array_push($dial,array("value" => $widgetDialDataArray[$i]));
51 | }
52 |
53 | $arrChartConfig["colorRange"] = $colorDataObj;
54 | $arrChartConfig["dials"] = array( "dial" => $dial);
55 |
56 | // JSON Encode the data to retrieve the string containing the JSON representation of the data in the array.
57 | $jsonEncodedData = json_encode($arrChartConfig);
58 |
59 | // Widget object
60 | $Widget = new FusionCharts("angulargauge", "MyFirstWidget" , "400", "250", "widget-container", "json", $jsonEncodedData);
61 |
62 | // Render the Widget
63 | $Widget->render();
64 |
65 | ?>
66 | Simple Widget Using Array
67 | Widget will render here!
68 |
69 |
70 | Go Back
71 |
72 |
73 |
--------------------------------------------------------------------------------
/samples/pages/product-life-cycle-event.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
24 |
25 |
26 |
27 |
28 | addEvent("dataLoaded", "onDataLoaded");
71 |
72 | // Render the chart
73 | $Chart->render();
74 |
75 | ?>
76 | Example of event(product life cycle event)
77 | Chart will render here!
78 |
79 |
80 |
83 |
84 | Go Back
85 |
86 |
87 |
88 |
--------------------------------------------------------------------------------
/samples/pages/chart-message.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
24 |
25 |
26 |
27 |
28 | addMessage("loadMessage", "please wait data is being loaded");
72 | $Chart->addMessage("loadMessageFontSize", "18");
73 |
74 | // Render the chart
75 | $Chart->render();
76 |
77 | ?>
78 | Message related attributes and configuration
79 | Chart will render here!
80 |
81 |
82 |
83 | Go Back
84 |
85 |
86 |
87 |
--------------------------------------------------------------------------------
/samples/pages/chart-database.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Chart Using Database (MySQL)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | connect_error) {
34 | exit("There was an error with your connection: ".$dbhandle->connect_error);
35 | }
36 |
37 | $strQuery = "SELECT Country, SUM(`Total Sales`) as TotalSales FROM sales_record GROUP BY Country";
38 |
39 | $labelValueArray = array();
40 |
41 | $result = $dbhandle->query($strQuery) or exit("Error code ({$dbhandle->errno}): {$dbhandle->error}");
42 | if ($result) {
43 | while($row = mysqli_fetch_array($result)) {
44 | array_push($labelValueArray,
45 | array(
46 | "label" => $row["Country"],
47 | "value" => $row["TotalSales"]
48 | )
49 | );
50 | }
51 | }
52 |
53 | $chartConfigObj = array ( "chart" =>
54 | array(
55 | "caption" => "Sales by Country",
56 | "xAxisName" => "Country",
57 | "yAxisName" => "Total Sales",
58 | "numberSuffix" => "K",
59 | "theme" => "fusion"
60 | )
61 | );
62 |
63 | $chartConfigObj["data"] = $labelValueArray;
64 |
65 | $chartData = json_encode($chartConfigObj);
66 |
67 | // chart object
68 | $Chart = new FusionCharts("pie3d", "chart-1" , "600", "400", "chart-container", "json", $chartData);
69 |
70 | // Render the chart
71 | $Chart->render();
72 | ?>
73 | Chart Using Database (MySQL)
74 | Chart will render here!
75 |
76 |
77 | Go Back
78 |
79 |
80 |
--------------------------------------------------------------------------------
/samples/pages/number-format.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
26 |
27 |
28 |
29 |
30 | addEvent("renderComplete", "onRenderComplete");
73 |
74 | // Render the chart
75 | $Chart->render();
76 |
77 | ?>
78 | Example of event(Number format)
79 | Chart will render here!
80 |
81 |
82 |
85 |
86 |
87 | Go Back
88 |
89 |
90 |
91 |
--------------------------------------------------------------------------------
/samples/pages/special-event.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
24 |
25 |
26 |
27 |
28 | addEvent("realtimeUpdateComplete", "onUpdate");
71 |
72 | // Render the chart
73 | $Chart->render();
74 |
75 | ?>
76 | Example of event(interactive event)
77 | Chart will render here!
78 |
79 |
80 |
83 |
84 | Go Back
85 |
86 |
87 |
88 |
--------------------------------------------------------------------------------
/samples/pages/update-data-runtime.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Angular Gauge
10 |
11 |
12 |
13 |
19 |
25 |
26 |
27 |
28 |
29 | render();
67 |
68 | ?>
69 | Update data at runtime
70 | Chart will render here!
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 | Go Back
80 |
81 |
82 |
--------------------------------------------------------------------------------
/samples/pages/interactive-event.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
28 |
29 |
30 |
31 |
32 | addEvent("dataplotClick", "onDataplotClick");
75 |
76 | // Render the chart
77 | $Chart->render();
78 |
79 | ?>
80 | Example of event(interactive event)
81 | Chart will render here!
82 |
83 |
84 |
87 |
88 |
89 | Go Back
90 |
91 |
92 |
93 |
--------------------------------------------------------------------------------
/samples/pages/simple-map.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple Map Using Array
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | array(
27 | "caption" => "Average Annual Population Growth",
28 | "subcaption" => " 1955-2015",
29 | "numbersuffix" => "%",
30 | "includevalueinlabels" => "1",
31 | "labelsepchar" => ": ",
32 | "entityFillHoverColor" => "#FFF9C4",
33 | "theme" => "fusion"
34 | )
35 | );
36 |
37 | // Widget color range data
38 | $colorDataObj = array("minvalue" => "0", "code" => "#FFE0B2", "gradient" => "1",
39 | "color" => array(
40 | ["minValue" => "0", "maxValue" => "50", "code" => "#F2726F"],
41 | ["minValue" => "50", "maxValue" => "75", "code" => "#FFC533"],
42 | ["minValue" => "75", "maxValue" => "100", "code" => "#62B58F"]
43 | )
44 | );
45 |
46 | // Map data array
47 | $mapDataArray = array(
48 | ["NA", ".82", "1"],
49 | ["SA", "2.04", "1"],
50 | ["AS", "1.78", "1"],
51 | ["EU", ".40", "1"],
52 | ["AF", "2.58", "1"],
53 | ["AU", "1.30", "1"]
54 | );
55 |
56 | $mapData = array();
57 |
58 | for($i = 0; $i < count($mapDataArray); $i++) {
59 | array_push($mapData,array("id" => $mapDataArray[$i][0], "value" => $mapDataArray[$i][1], "showLabel" => $mapDataArray[$i][2]));
60 | }
61 |
62 | $arrMapConfig["colorRange"] = $colorDataObj;
63 | $arrMapConfig["data"] = $mapData;
64 |
65 | // JSON Encode the data to retrieve the string containing the JSON representation of the data in the array.
66 | $jsonEncodedData = json_encode($arrMapConfig);
67 |
68 | // Map object
69 | $Map = new FusionCharts("maps/world", "MyFirstMap" , "800", "500", "map-container", "json", $jsonEncodedData);
70 |
71 | // Render the Map
72 | $Map->render();
73 |
74 | ?>
75 |
76 | Simple Map Using Array
77 | Map will render here!
78 |
79 |
80 | Go Back
81 |
82 |
83 |
--------------------------------------------------------------------------------
/samples/pages/drilldown-data-handler.php:
--------------------------------------------------------------------------------
1 | connect_error) {
12 | exit("There was an error with your connection: ".$dbhandle->connect_error);
13 | }
14 |
15 | // Drilldown column order
16 | $columnLevels = ["Region", "Country", "City"];
17 | $maxDrill = sizeof($columnLevels);
18 |
19 | // Get drilldown parameters
20 | $columnClickedUpon = $_GET["label"];
21 | $drillDownLevel = $_GET["drillLevel"];
22 |
23 | if ($drillDownLevel == null) {
24 | $drillDownLevel = "0";
25 | #echo "drillDown before 1: $drillDownLevel";
26 | $data = GetDBData($columnLevels[(int)$drillDownLevel], null, null, $dbhandle, "0", $maxDrill);
27 | } else {
28 | $iDrillDownLevel = (int)$drillDownLevel + 1;
29 | $drillDownLevel = (string)$iDrillDownLevel;
30 | #echo "drillDown before 2: $drillDownLevel";
31 | $data = GetDBData($columnLevels[$iDrillDownLevel], $columnClickedUpon, $columnLevels[$iDrillDownLevel - 1], $dbhandle, $drillDownLevel, $maxDrill);
32 | }
33 |
34 | $iDrillDownLevel = (int)$drillDownLevel;
35 |
36 |
37 |
38 | function GetDBData($columnName, $parentValue, $parentName, $dbhandle, $drillDownLevel, $maxDrill) {
39 |
40 | #echo "DrillDownLevel after: $drillDownLevel";
41 |
42 | $chartConfigObj = array ( "chart" =>
43 | array(
44 | "caption" => "Sales by $columnName",
45 | "xAxisName" => $columnName,
46 | "yAxisName" => "Total Sales",
47 | "numberSuffix" => "K",
48 | "theme" => "fusion"
49 | )
50 | );
51 |
52 | if ($parentValue == null) {
53 | $strQuery = "SELECT $columnName, SUM(`Total Sales`) as TotalSales FROM sales_record GROUP BY $columnName";
54 | } else {
55 | $strQuery = "SELECT $columnName, SUM(`Total Sales`) as TotalSales FROM sales_record WHERE $parentName = '$parentValue' GROUP BY $columnName";
56 | }
57 |
58 | $labelValueArray = array();
59 |
60 | $result = $dbhandle->query($strQuery) or exit("Error code ({$dbhandle->errno}): {$dbhandle->error}");
61 | if ($result) {
62 | while($row = mysqli_fetch_array($result)) {
63 | $label = $row[$columnName];
64 | if (((int)$drillDownLevel) < $maxDrill - 1) {
65 | array_push($labelValueArray,
66 | array(
67 | "label" => "$label",
68 | "value" => $row["TotalSales"],
69 | "link" => "newchart-jsonurl-drilldown-data-handler.php?label=$label&drillLevel=$drillDownLevel"
70 | )
71 | );
72 | } else {
73 | array_push($labelValueArray,
74 | array(
75 | "label" => "$label",
76 | "value" => $row["TotalSales"]
77 | )
78 | );
79 | }
80 | }
81 | };
82 |
83 |
84 | $chartConfigObj["data"] = $labelValueArray;
85 |
86 | $jsonEncodedData = json_encode($chartConfigObj);
87 |
88 | echo $jsonEncodedData;
89 | }
90 | ?>
--------------------------------------------------------------------------------
/samples/pages/different-language.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
92 |
93 | ?>
94 | Different language example
95 | Chart will render here!
96 |
97 |
98 | Go Back
99 |
100 |
101 |
102 |
--------------------------------------------------------------------------------
/samples/pages/Single-Event-Overlay.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Interest Rate Analysis'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subCaption", "{
29 | text: 'Federal Reserve (USA)'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: 'Interest Rate',
34 | format:{
35 | suffix: '%'
36 | },
37 | title: 'Interest Rate'
38 | }]");
39 |
40 | $timeSeries->AddAttribute("xAxis", "{
41 | plot: 'Time',
42 | timemarker: [{
43 | start: 'Mar-1980',
44 | label: 'US inflation peaked at 14.8%.',
45 | timeFormat: ' % b -% Y',
46 | style: {
47 | marker:
48 | {
49 | fill: '#D0D6F4'
50 | }
51 | }
52 | }, {
53 | start: 'May-1981',
54 | label: 'To control inflation, the Fed started {br} raising interest rates to over {br} 20%.',
55 | timeFormat: '%b-%Y'
56 | }, {
57 | start: 'Jun-1983',
58 | label: 'By proactive actions of Mr.Volcker, {br} the inflation falls to 2.4% {br} from the peak of over 14% {br} just three years ago.',
59 | timeFormat: '%b-%Y',
60 | style: {
61 | marker: {
62 | fill: '#D0D6F4'
63 | }
64 | }
65 | }, {
66 | start: 'Oct-1987',
67 | label: 'The Dow Jones Industrial Average lost {br} about 30% of it’s value.',
68 | timeFormat: '%b-%Y',
69 | style: {
70 | marker: {
71 | fill: '#FBEFCC'
72 | }
73 | }
74 | }, {
75 | start: 'Jan-1989',
76 | label: 'George H.W. Bush becomes {br} the 41st president of US!',
77 | timeFormat: '%b-%Y'
78 | }, {
79 | start: 'Aug-1990',
80 | label: 'The oil prices spiked to $35 {br} per barrel from $15 per barrel {br} because of the Gulf War.',
81 | timeFormat: '%b-%Y'
82 | }, {
83 | start: 'Dec-1996',
84 | label: 'Alan Greenspan warns of the dangers {br} of \"irrational exuberance\" in financial markets, {br} an admonition that goes unheeded',
85 | timeFormat: '%b-%Y'
86 | }, {
87 | start: 'Sep-2008',
88 | label: 'Lehman Brothers collapsed!',
89 | timeFormat: '%b-%Y'
90 | },{
91 | start: 'Mar-2009',
92 | label: 'The net worth of US households {br} stood at a trough of $55 trillion.',
93 | timeFormat: '%b-%Y',
94 | style: {
95 | marker: {
96 | fill: '#FBEFCC'
97 | }
98 | }
99 | }, {
100 | start: 'Oct-2009',
101 | label: 'Unemployment rate peaked {br} in given times to 10%.',
102 | timeFormat: '%b-%Y'
103 | }]
104 | }");
105 |
106 |
107 | // chart object
108 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
109 |
110 | // Render the chart
111 | $Chart->render();
112 |
113 | ?>
114 |
115 | Single event overlay
116 | Chart will render here!
117 |
118 |
119 | Go Back
120 |
121 |
122 |
--------------------------------------------------------------------------------
/samples/pages/mscolumn2d-sample.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Multiseries Column 2D Sample
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | \$dataValue apps on \$seriesName in \$label\",
33 | \"theme\": \"fusion\"
34 | },
35 |
36 | \"categories\": [{
37 | \"category\": [{
38 | \"label\": \"2012\"
39 | }, {
40 | \"label\": \"2013\"
41 | }, {
42 | \"label\": \"2014\"
43 | }, {
44 | \"label\": \"2015\"
45 | },{
46 | \"label\": \"2016\"
47 | }
48 | ]
49 | }],
50 | \"dataset\": [{
51 | \"seriesname\": \"iOS App Store\",
52 | \"data\": [{
53 | \"value\": \"125000\"
54 | }, {
55 | \"value\": \"300000\"
56 | }, {
57 | \"value\": \"480000\"
58 | }, {
59 | \"value\": \"800000\"
60 | }, {
61 | \"value\": \"1100000\"
62 | }]
63 | }, {
64 | \"seriesname\": \"Google Play Store\",
65 | \"data\": [{
66 | \"value\": \"70000\"
67 | }, {
68 | \"value\": \"150000\"
69 | }, {
70 | \"value\": \"350000\"
71 | }, {
72 | \"value\": \"600000\"
73 | },{
74 | \"value\": \"1400000\"
75 | }]
76 | }, {
77 | \"seriesname\": \"Amazon AppStore\",
78 | \"data\": [{
79 | \"value\": \"10000\"
80 | }, {
81 | \"value\": \"100000\"
82 | }, {
83 | \"value\": \"300000\"
84 | }, {
85 | \"value\": \"600000\"
86 | },{
87 | \"value\": \"900000\"
88 | }]
89 | }]
90 | }";
91 |
92 | // chart object
93 | $Chart = new FusionCharts("mscolumn2d", "chart-1" , "700", "400", "chart-container", "json", $chartData);
94 |
95 | // Render the chart
96 | $Chart->render();
97 |
98 | ?>
99 |
100 | Multiseries Column 2D Chart
101 | Chart will render here!
102 |
103 |
104 | Go Back
105 |
106 |
107 |
--------------------------------------------------------------------------------
/samples/pages/chart-annotation.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
99 |
100 | ?>
101 | Using Annotations On Chart
102 | Chart will render here!
103 |
104 |
105 | Go Back
106 |
107 |
108 |
109 |
--------------------------------------------------------------------------------
/samples/pages/highlight-specific-data-points.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | render();
99 |
100 | ?>
101 | Highlight specific data points through API
102 | Chart will render here!
103 |
104 |
105 | Go Back
106 |
107 |
108 |
109 |
--------------------------------------------------------------------------------
/samples/pages/customizing-tooltip.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | \$label :{br}State: \$seriesName{br}Sales : \$dataValue{br}Market share in State : \$percentValue{br}Overall market share of \$label: \$xAxisPercentValue\",
36 | \"theme\": \"fusion\"
37 | },
38 | \"categories\": [
39 | {
40 | \"category\": [
41 | {
42 | \"label\": \"Bose\"
43 | },
44 | {
45 | \"label\": \"Dell\"
46 | },
47 | {
48 | \"label\": \"Apple\"
49 | }
50 | ]
51 | }
52 | ],
53 | \"dataset\": [
54 | {
55 | \"seriesname\": \"California\",
56 | \"data\": [
57 | {
58 | \"value\": \"335000\"
59 | },
60 | {
61 | \"value\": \"225100\"
62 | },
63 | {
64 | \"value\": \"164200\"
65 | }
66 | ]
67 | },
68 | {
69 | \"seriesname\": \"Washington\",
70 | \"data\": [
71 | {
72 | \"value\": \"215000\"
73 | },
74 | {
75 | \"value\": \"198000\"
76 | },
77 | {
78 | \"value\": \"120000\"
79 | }
80 | ]
81 | },
82 | {
83 | \"seriesname\": \"Nevada\",
84 | \"data\": [
85 | {
86 | \"value\": \"298000\"
87 | },
88 | {
89 | \"value\": \"109300\"
90 | },
91 | {
92 | \"value\": \"153600\"
93 | }
94 | ]
95 | }
96 | ]
97 | }";
98 |
99 | // chart object
100 | $Chart = new FusionCharts("marimekko", "chart-1" , "600", "400", "chart-container", "json", $chartData);
101 |
102 | // Render the chart
103 | $Chart->render();
104 |
105 | ?>
106 | Customizing tooltip
107 | Chart will render here!
108 |
109 |
110 | Go Back
111 |
112 |
113 |
114 |
--------------------------------------------------------------------------------
/samples/pages/dynamic-chart-type.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | USA Map
10 |
11 |
12 |
13 |
19 |
39 |
40 |
41 |
42 |
43 | render();
86 |
87 | ?>
88 |
89 | Dynamic Chart Type Change
90 |
91 |
92 |
93 |
94 |
95 |
98 |
101 |
104 |
105 |
106 |
107 |
108 |
109 |
Chart will render here!
110 |
112 |
113 | Go Back
114 |
115 |
116 |
--------------------------------------------------------------------------------
/samples/pages/dynamic-chart-resize.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | USA Map
10 |
11 |
12 |
13 |
19 |
36 |
37 |
38 |
39 |
40 | render();
83 |
84 | ?>
85 |
86 | Chart Auto-Resise Sample
87 |
88 |
89 |
90 |
91 |
92 |
95 |
98 |
101 |
102 |
103 |
104 |
105 |
106 |
Chart will render here!
107 |
109 |
110 | Go Back
111 |
112 |
113 |
--------------------------------------------------------------------------------
/samples/pages/stacked-column2d-line-chart-sample.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Stacked Column 2D Line Chart Sample
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | \$dataValue\",
32 | \"showhovereffect\": \"1\",
33 | \"yaxisname\": \"$ (In billions)\",
34 | \"showSum\":\"1\",
35 | \"theme\": \"fusion\"
36 | },
37 | \"categories\": [{
38 | \"category\": [{
39 | \"label\": \"2013\"
40 | }, {
41 | \"label\": \"2014\"
42 | }, {
43 | \"label\": \"2015\"
44 | }, {
45 | \"label\": \"2016\"
46 | }]
47 | }],
48 | \"dataset\": [{
49 | \"seriesname\": \"iPhone\",
50 | \"data\": [{
51 | \"value\": \"21\"
52 | }, {
53 | \"value\": \"24\"
54 | }, {
55 | \"value\": \"27\"
56 | }, {
57 | \"value\": \"30\"
58 | }]
59 | }, {
60 | \"seriesname\": \"iPad\",
61 | \"data\": [{
62 | \"value\": \"8\"
63 | }, {
64 | \"value\": \"10\"
65 | }, {
66 | \"value\": \"11\"
67 | }, {
68 | \"value\": \"12\"
69 | }]
70 | }, {
71 | \"seriesname\": \"Macbooks\",
72 | \"data\": [{
73 | \"value\": \"2\"
74 | }, {
75 | \"value\": \"4\"
76 | }, {
77 | \"value\": \"5\"
78 | }, {
79 | \"value\": \"5.5\"
80 | }]
81 | }, {
82 | \"seriesname\": \"Others\",
83 | \"data\": [{
84 | \"value\": \"2\"
85 | }, {
86 | \"value\": \"4\"
87 | }, {
88 | \"value\": \"9\"
89 | }, {
90 | \"value\": \"11\"
91 | }]
92 | }, {
93 | \"seriesname\": \"Profit\",
94 | \"plotToolText\" : \"Total profit in \$label was \$dataValue\",
95 | \"renderas\": \"Line\",
96 | \"data\": [{
97 | \"value\": \"17\"
98 | }, {
99 | \"value\": \"19\"
100 | }, {
101 | \"value\": \"13\"
102 | }, {
103 | \"value\": \"18\"
104 | }]
105 | }]
106 | }";
107 |
108 | // chart object
109 | $Chart = new FusionCharts("stackedColumn2DLine", "chart-1" , "600", "400", "chart-container", "json", $chartData);
110 |
111 | // Render the chart
112 | $Chart->render();
113 |
114 | ?>
115 | Stacked Column 2D with Line Chart
116 | Chart will render here!
117 |
118 |
119 | Go Back
120 |
121 |
122 |
--------------------------------------------------------------------------------
/samples/pages/special-chart-type-api.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
52 |
53 |
54 |
55 |
56 | \$percentValue of web servers run on \$label servers\",
62 | \"showLegend\": \"0\",
63 | \"enableMultiSlicing\": \"0\",
64 | \"showPercentValues\": \"1\",
65 | \"legendPosition\": \"bottom\",
66 | \"useDataPlotColorForLabels\": \"1\",
67 | \"theme\": \"fusion\"
68 | },
69 | \"data\": [{
70 | \"label\": \"Apache\",
71 | \"value\": \"32647479\"
72 | }, {
73 | \"label\": \"Microsoft\",
74 | \"value\": \"22100932\"
75 | }, {
76 | \"label\": \"Zeus\",
77 | \"value\": \"14376\"
78 | }, {
79 | \"label\": \"Other\",
80 | \"value\": \"18674221\"
81 | }]
82 | }";
83 |
84 | // chart object
85 | $Chart = new FusionCharts("pie2d", "chart-1" , "700", "400", "chart-container", "json", $chartData);
86 |
87 | // Attach message with message string.
88 | $Chart->addEvent("dataplotClick", "plotClickHandler");
89 |
90 | // Render the chart
91 | $Chart->render();
92 |
93 | ?>
94 | Example of event(SpecialChartType API)
95 | Chart will render here!
96 |
97 |
98 |
99 |
102 |
105 |
108 |
111 |
114 |
115 |
116 |
117 | Go Back
118 |
119 |
120 |
121 |
--------------------------------------------------------------------------------
/samples/pages/Annotating-single-data-point.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Simple FusionTime Chart
10 |
11 |
12 |
13 |
14 |
15 |
16 | AddAttribute("caption", "{
25 | text: 'Interest Rate Analysis'
26 | }");
27 |
28 | $timeSeries->AddAttribute("subCaption", "{
29 | text: 'Federal Reserve (USA)'
30 | }");
31 |
32 | $timeSeries->AddAttribute("yAxis", "[{
33 | plot: 'Interest Rate',
34 | format:{
35 | suffix: '%'
36 | },
37 | title: 'Interest Rate'
38 | }]");
39 |
40 | $timeSeries->AddAttribute("dataMarker", "[{
41 | seriesName: 'Interest Rate',
42 | time: 'Mar-1980',
43 | identifier: 'H',
44 | timeFormat: '%b-%Y',
45 | tooltext: 'As a part of credit control program, under the leadership of Paul Volcker, the Fed tightened the money supply, allowing the federal fund rates to approach 20 percent.'
46 | }, {
47 | seriesName: 'Interest Rate',
48 | time: 'Aug-1982',
49 | identifier: 'L',
50 | timeFormat: '%b-%Y',
51 | tooltext: 'The FED eases off the monetary brakes, allowing interest rates to fall and the economy to begin a strong recovery.'
52 | }, {
53 | seriesName: 'Interest Rate',
54 | time: 'Oct-1987',
55 | identifier: 'L',
56 | timeFormat: '%b-%Y',
57 | tooltext: 'The FED is forced to ease rate after the stock market crash.'
58 | }, {
59 | seriesName: 'Interest Rate',
60 | time: 'May-1989',
61 | identifier: 'H',
62 | timeFormat: '%b-%Y',
63 | tooltext: 'Liquidity problem forced the Fed to increase rate to nearly 10%.'
64 | }, {
65 | seriesName: 'Interest Rate',
66 | time: 'Sept-1992',
67 | identifier: 'L',
68 | timeFormat: '%b-%Y',
69 | tooltext: 'To fight the jobless economy growth the Fed had to reduce the interest rate to 3%.'
70 | }, {
71 | seriesName: 'Interest Rate',
72 | time: 'Jun-2003',
73 | identifier: 'L',
74 | timeFormat: '%b-%Y',
75 | tooltext: 'Struggling to revive the economy, the FED cuts it’s benchmark rate to 1%.'
76 | }, {
77 | seriesName: 'Interest Rate',
78 | time: 'Sep-2007',
79 | identifier: 'L',
80 | timeFormat: '%b-%Y',
81 | tooltext: 'Fed started reducing the Federal Fund Rate.'
82 | }, {
83 | seriesName: 'Interest Rate',
84 | time: 'Dec-2008',
85 | identifier: 'L',
86 | timeFormat: '%b-%Y',
87 | tooltext: 'Fed reduced the interest rates to sub 0.25% to manage the menace of longest economic downturn since World War 2'
88 | }]");
89 |
90 |
91 | // chart object
92 | $Chart = new FusionCharts("timeseries", "MyFirstChart" , "700", "450", "chart-container", "json", $timeSeries);
93 |
94 | // Render the chart
95 | $Chart->render();
96 |
97 | ?>
98 |
99 | Annotating single data point
100 | Chart will render here!
101 |
102 |
103 | Go Back
104 |
105 |
106 |
--------------------------------------------------------------------------------
/samples/pages/chart-product-level-api.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
41 |
42 |
43 |
44 |
50 |
66 |
67 |
68 |
69 |
70 | render();
113 |
114 | ?>
115 | Example of product level API
116 | Chart will render here!
117 |
118 |
119 |
122 |
123 |
124 |
125 |
126 |
127 |
128 |
129 |
130 |
131 |
132 | Go Back
133 |
134 |
135 |
136 |
--------------------------------------------------------------------------------
/samples/pages/updating-chart-properties.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
41 |
42 |
43 |
44 |
50 |
66 |
67 |
68 |
69 |
70 | render();
113 |
114 | ?>
115 | Updating chart properties at runtime
116 | Chart will render here!
117 |
118 |
119 |
122 |
123 |
124 |
125 |
126 |
127 |
128 |
129 |
130 |
131 |
132 | Go Back
133 |
134 |
135 |
136 |
--------------------------------------------------------------------------------
/samples/pages/chart-export-at-client.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | \$dataValue in 2016\",
61 | \"data\": [{
62 | \"value\": \"3\"
63 | }, {
64 | \"value\": \"3\"
65 | }, {
66 | \"value\": \"10\"
67 | }, {
68 | \"value\": \"7\"
69 | }, {
70 | \"value\": \"7.4\"
71 | }, {
72 | \"value\": \"10\"
73 | }, {
74 | \"value\": \"5.4\"
75 | }, {
76 | \"value\": \"4.5\"
77 | }, {
78 | \"value\": \"4.1\"
79 | }, {
80 | \"value\": \"4\"
81 | }, {
82 | \"value\": \"3.7\"
83 | }, {
84 | \"value\": \"9.3\"
85 | }]
86 | }, {
87 | \"seriesName\": \"2017 Projected Salary Increase\",
88 | \"plotToolText\": \"Salaries expected to increase by \$dataValue in 2017\",
89 | \"renderAs\": \"line\",
90 | \"data\": [{
91 | \"value\": \"3\"
92 | }, {
93 | \"value\": \"2.8\"
94 | }, {
95 | \"value\": \"10\"
96 | }, {
97 | \"value\": \"6.9\"
98 | }, {
99 | \"value\": \"6.7\"
100 | }, {
101 | \"value\": \"9.4\"
102 | }, {
103 | \"value\": \"5.5\"
104 | }, {
105 | \"value\": \"5\"
106 | }, {
107 | \"value\": \"4\"
108 | }, {
109 | \"value\": \"4\"
110 | }, {
111 | \"value\": \"4.5\"
112 | }, {
113 | \"value\": \"9.8\"
114 | }]
115 | }, {
116 | \"seriesName\": \"Inflation rate\",
117 | \"plotToolText\": \"\$dataValue projected inflation\",
118 | \"renderAs\": \"area\",
119 | \"showAnchors\": \"0\",
120 | \"data\": [{
121 | \"value\": \"1.6\"
122 | }, {
123 | \"value\": \"0.6\"
124 | }, {
125 | \"value\": \"5.6\"
126 | }, {
127 | \"value\": \"2.3\"
128 | }, {
129 | \"value\": \"7\"
130 | }, {
131 | \"value\": \"5.6\"
132 | }, {
133 | \"value\": \"0.2\"
134 | }, {
135 | \"value\": \"1\"
136 | }, {
137 | \"value\": \"2.6\"
138 | }, {
139 | \"value\": \"0\"
140 | }, {
141 | \"value\": \"1.1\"
142 | }, {
143 | \"value\": \"2.4\"
144 | }]
145 | }]
146 | }";
147 |
148 | // chart object
149 | $Chart = new FusionCharts("mscombi3d", "chart-1" , "700", "400", "chart-container", "json", $chartData);
150 |
151 | // Render the chart
152 | $Chart->render();
153 |
154 | ?>
155 | Export Chart As Image (client-side)
156 | Chart will render here!
157 |
158 |
159 | Go Back
160 |
161 |
162 |
163 |
--------------------------------------------------------------------------------
/samples/pages/chart-export-at-server.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 |
10 | FusionCharts | Export Chart As Image (server-side)
11 |
12 |
13 |
14 |
20 |
21 |
22 |
23 |
24 | \$dataValue in 2016\",
63 | \"data\": [{
64 | \"value\": \"3\"
65 | }, {
66 | \"value\": \"3\"
67 | }, {
68 | \"value\": \"10\"
69 | }, {
70 | \"value\": \"7\"
71 | }, {
72 | \"value\": \"7.4\"
73 | }, {
74 | \"value\": \"10\"
75 | }, {
76 | \"value\": \"5.4\"
77 | }, {
78 | \"value\": \"4.5\"
79 | }, {
80 | \"value\": \"4.1\"
81 | }, {
82 | \"value\": \"4\"
83 | }, {
84 | \"value\": \"3.7\"
85 | }, {
86 | \"value\": \"9.3\"
87 | }]
88 | }, {
89 | \"seriesName\": \"2017 Projected Salary Increase\",
90 | \"plotToolText\": \"Salaries expected to increase by \$dataValue in 2017\",
91 | \"renderAs\": \"line\",
92 | \"data\": [{
93 | \"value\": \"3\"
94 | }, {
95 | \"value\": \"2.8\"
96 | }, {
97 | \"value\": \"10\"
98 | }, {
99 | \"value\": \"6.9\"
100 | }, {
101 | \"value\": \"6.7\"
102 | }, {
103 | \"value\": \"9.4\"
104 | }, {
105 | \"value\": \"5.5\"
106 | }, {
107 | \"value\": \"5\"
108 | }, {
109 | \"value\": \"4\"
110 | }, {
111 | \"value\": \"4\"
112 | }, {
113 | \"value\": \"4.5\"
114 | }, {
115 | \"value\": \"9.8\"
116 | }]
117 | }, {
118 | \"seriesName\": \"Inflation rate\",
119 | \"plotToolText\": \"\$dataValue projected inflation\",
120 | \"renderAs\": \"area\",
121 | \"showAnchors\": \"0\",
122 | \"data\": [{
123 | \"value\": \"1.6\"
124 | }, {
125 | \"value\": \"0.6\"
126 | }, {
127 | \"value\": \"5.6\"
128 | }, {
129 | \"value\": \"2.3\"
130 | }, {
131 | \"value\": \"7\"
132 | }, {
133 | \"value\": \"5.6\"
134 | }, {
135 | \"value\": \"0.2\"
136 | }, {
137 | \"value\": \"1\"
138 | }, {
139 | \"value\": \"2.6\"
140 | }, {
141 | \"value\": \"0\"
142 | }, {
143 | \"value\": \"1.1\"
144 | }, {
145 | \"value\": \"2.4\"
146 | }]
147 | }]
148 | }";
149 |
150 |
151 |
152 | // chart object
153 | $Chart = new FusionCharts("mscombi3d", "chart-1" , "700", "400", "chart-container", "json", $chartData);
154 |
155 | // Render the chart
156 | $Chart->render();
157 | ?>
158 |
159 |
160 |
161 | Export Chart As Image (server-side)
162 | Chart will render here!
163 |
164 |
165 | Go Back
166 |
167 |
168 |
--------------------------------------------------------------------------------
/samples/index.php:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | FusionCharts Samples for PHP
8 |
9 | -
10 | Line chart with time axis
11 |
12 | -
13 | Plotting multiple series on time axis
14 |
15 | -
16 | Column and line combination on time axis
17 |
18 | -
19 | Plotting two variables (measures)
20 |
21 | -
22 | Different plot type for each variable (measure)
23 |
24 | -
25 | Column chart with time axis
26 |
27 | -
28 | Area chart with time axis
29 |
30 | -
31 | Interactive candlestick chart
32 |
33 | -
34 | Annotating single data point
35 |
36 | -
37 | Single event overlay
38 |
39 | -
40 | Date range event overlay
41 |
42 | -
43 | Adding a reference line
44 |
45 | -
46 | Simple Chart Using Array
47 |
48 | -
49 | Simple Widget Using Array
50 |
51 | -
52 | Simple Map Using Array
53 |
54 | -
55 | Angular Gauge
56 |
57 | -
58 | Export Chart As Image (client-side)
59 |
60 | -
61 | Export Chart As Image (server-side)
62 |
63 | -
64 | Chart with Drill-Down Feature
65 |
66 | -
67 | Multiseries Column 2D Chart
68 |
69 | -
70 | Multiseries Combination 3D Chart
71 |
72 | -
73 | Pie 3D Chart
74 |
75 | -
76 | Stacked Column 2D with Line Chart
77 |
78 | -
79 | Chart Using Database (MySQL)
80 |
81 | -
82 | USA Map
83 |
84 | -
85 | Chart Themes
86 |
87 | -
88 | Chart using data from XML URL
89 |
90 | -
91 | Chart using data from JSON URL
92 |
93 | -
94 | Dynamic Chart Resize
95 |
96 | -
97 | Chart Type Change At Runtime
98 |
99 | -
100 | Using Annotations On Chart
101 |
102 | -
103 | Updating Different Chart
104 |
105 | -
106 | Different language example
107 |
108 | -
109 | Chart using special character in XML data format
110 |
111 | -
112 | Customizing tooltip
113 |
114 | -
115 | Example of event(product life cycle event)
116 |
117 | -
118 | Example of event(interactive event)
119 |
120 | -
121 | Message related attributes and configuration
122 |
123 | -
124 | Example of event(interactive event)
125 |
126 | -
127 | Example of event(Number format)
128 |
129 | -
130 | Example of event(SpecialChartType API)
131 |
132 | -
133 | Add/Remove event at runtime(Chart instance level API)
134 |
135 | -
136 | Example of product level API
137 |
138 | -
139 | Updating chart properties at runtime
140 |
141 | -
142 | Highlight specific data points through API
143 |
144 | -
145 | Update data at runtime
146 |
147 | -
148 | Get data from select scatter chart and show them in tabular format
149 |
150 |
151 |
152 |
153 |
154 |
--------------------------------------------------------------------------------
/samples/pages/chart-instance-level-api.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
54 |
55 |
56 |
57 |
63 |
76 |
77 |
78 |
79 |
80 | render();
123 |
124 | ?>
125 | Add/Remove event at runtime(Chart instance level API)
126 | Chart will render here!
127 |
128 |
129 |
132 |
133 |
134 |
135 |
136 |
137 |
138 |
139 |
140 |
141 |
142 | Go Back
143 |
144 |
145 |
146 |
--------------------------------------------------------------------------------
/samples/pages/mscombi3d-chart-sample.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Multiseries Combination 3D Chart
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | \$dataValue in 2016\",
63 | \"data\": [{
64 | \"value\": \"3\"
65 | }, {
66 | \"value\": \"3\"
67 | }, {
68 | \"value\": \"10\"
69 | }, {
70 | \"value\": \"7\"
71 | }, {
72 | \"value\": \"7.4\"
73 | }, {
74 | \"value\": \"10\"
75 | }, {
76 | \"value\": \"5.4\"
77 | }, {
78 | \"value\": \"4.5\"
79 | }, {
80 | \"value\": \"4.1\"
81 | }, {
82 | \"value\": \"4\"
83 | }, {
84 | \"value\": \"3.7\"
85 | }, {
86 | \"value\": \"9.3\"
87 | }]
88 | }, {
89 | \"seriesName\": \"2017 Projected Salary Increase\",
90 | \"plotToolText\" : \"Salaries expected to increase by \$dataValue in 2017\",
91 | \"renderAs\": \"line\",
92 | \"data\": [{
93 | \"value\": \"3\"
94 | }, {
95 | \"value\": \"2.8\"
96 | }, {
97 | \"value\": \"10\"
98 | }, {
99 | \"value\": \"6.9\"
100 | }, {
101 | \"value\": \"6.7\"
102 | }, {
103 | \"value\": \"9.4\"
104 | }, {
105 | \"value\": \"5.5\"
106 | }, {
107 | \"value\": \"5\"
108 | }, {
109 | \"value\": \"4\"
110 | }, {
111 | \"value\": \"4\"
112 | }, {
113 | \"value\": \"4.5\"
114 | }, {
115 | \"value\": \"9.8\"
116 | }]
117 | }, {
118 | \"seriesName\": \"Inflation rate\",
119 | \"plotToolText\" : \"\$dataValue projected inflation\",
120 | \"renderAs\": \"area\",
121 | \"showAnchors\":\"0\",
122 | \"data\": [{
123 | \"value\": \"1.6\"
124 | }, {
125 | \"value\": \"0.6\"
126 | }, {
127 | \"value\": \"5.6\"
128 | }, {
129 | \"value\": \"2.3\"
130 | }, {
131 | \"value\": \"7\"
132 | }, {
133 | \"value\": \"5.6\"
134 | }, {
135 | \"value\": \"0.2\"
136 | }, {
137 | \"value\": \"1\"
138 | }, {
139 | \"value\": \"2.6\"
140 | }, {
141 | \"value\": \"0\"
142 | }, {
143 | \"value\": \"1.1\"
144 | }, {
145 | \"value\": \"2.4\"
146 | }]
147 | }]
148 | }";
149 |
150 | // chart object
151 | $Chart = new FusionCharts("mscombi3d", "chart-1" , "600", "400", "chart-container", "json", $chartData);
152 |
153 | // Render the chart
154 | $Chart->render();
155 |
156 | ?>
157 | Multiseries Combination 3D Chart
158 | Chart will render here!
159 |
160 |
161 | Go Back
162 |
163 |
164 |
165 |
--------------------------------------------------------------------------------
/samples/pages/chart-themes.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | Chart Theme Sample
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | \$label
Product : \$seriesname
Sales : \$\$value\",
26 | \"theme\": \"fusion\"
27 | },
28 | \"categories\": [{
29 | \"category\": [{
30 | \"label\": \"Garden Groove harbour\"
31 | }, {
32 | \"label\": \"Bakersfield Central\"
33 | }, {
34 | \"label\": \"Los Angeles Topanga\"
35 | }, {
36 | \"label\": \"Compton-Rancho Dom\"
37 | }, {
38 | \"label\": \"Daly City Serramonte\"
39 | }]
40 | }],
41 | \"dataset\": [{
42 | \"seriesname\": \"Non-Food Products\",
43 | \"data\": [{
44 | \"value\": \"28800\"
45 | }, {
46 | \"value\": \"25400\"
47 | }, {
48 | \"value\": \"21800\"
49 | }, {
50 | \"value\": \"19500\"
51 | }, {
52 | \"value\": \"11500\"
53 | }]
54 | }, {
55 | \"seriesname\": \"Food Products\",
56 | \"data\": [{
57 | \"value\": \"17000\"
58 | }, {
59 | \"value\": \"19500\"
60 | }, {
61 | \"value\": \"12500\"
62 | }, {
63 | \"value\": \"14500\"
64 | }, {
65 | \"value\": \"17500\"
66 | }]
67 | }]
68 | }";
69 |
70 | $chartData2 = "{
71 | \"chart\": {
72 | \"caption\": \"Harry\'s SuperMart\",
73 | \"subCaption\": \"Top 5 stores in last month by revenue\",
74 | \"theme\": \"fusion\"
75 | },
76 | \"data\":[
77 | {
78 | \"label\": \"Bakersfield Central\",
79 | \"value\": \"880000\"
80 | },
81 | {
82 | \"label\": \"Garden Groove harbour\",
83 | \"value\": \"730000\"
84 | },
85 | {
86 | \"label\": \"Los Angeles Topanga\",
87 | \"value\": \"590000\"
88 | },
89 | {
90 | \"label\": \"Compton-Rancho Dom\",
91 | \"value\": \"520000\"
92 | },
93 | {
94 | \"label\": \"Daly City Serramonte\",
95 | \"value\": \"330000\"
96 | }
97 | ]
98 | }";
99 |
100 | // Chart 1
101 | $Chart1 = new FusionCharts("overlappedcolumn2d", "chart-id-1" , "600", "400", "chart-1", "json", $chartData1);
102 |
103 | // Chart 2
104 | $Chart2 = new FusionCharts("column2d", "chart-id-2" , "600", "400", "chart-2", "json", $chartData2);
105 |
106 | // Render the chart 1
107 | $Chart1->render();
108 |
109 | // Render the chart 2
110 | $Chart2->render();
111 |
112 | ?>
113 |
132 |
133 | Chart Theme Sample
134 |
135 |
136 |
<%= getChart1.render() %>
137 |
<%= getChart2.render() %>
138 |
139 |
141 |
142 |
143 |
144 |
145 |
146 |
147 |
148 |
151 |
154 |
157 |
160 |
161 |
162 |
163 | Go Back
164 |
165 |
166 |
--------------------------------------------------------------------------------
/samples/pages/updating-different-chart.php:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 | FusionCharts | Export Chart As Image (client-side)
10 |
11 |
12 |
13 |
19 |
95 |
96 |
97 |
98 |
99 | render();
138 | $secChart->render();
139 |
140 | ?>
141 | Updating Different Chart
142 |
143 |
144 | |
145 | Chart will render here!
146 | |
147 |
148 | Click on the left chart to update this one
149 | Chart will render here!
150 | |
151 |
152 |
153 |
154 |
155 | Go Back
156 |
157 |
158 |
159 |
--------------------------------------------------------------------------------
/samples/includes/fusioncharts.php:
--------------------------------------------------------------------------------
1 |
10 | FusionCharts.ready(function () {
11 | __FT__
12 | __FC__
13 | });
14 | ';
15 |
16 | private $constructorTemplate = 'new FusionCharts(__constructorOptions__);';
17 | private $renderTemplate = 'FusionCharts("__chartId__").render();';
18 | private $eventTemplate = 'FusionCharts("__chartId__").addEventListener("_fceventname_",_fceventbody_);';
19 |
20 | // constructor
21 | function __construct($type, $id, $width = 400, $height = 300, $renderAt, $dataFormat= null, $dataSource) {
22 | isset($type) ? $this->constructorOptions['type'] = $type : '';
23 | isset($id) ? $this->constructorOptions['id'] = $id : 'php-fc-'.time();
24 | isset($width) ? $this->constructorOptions['width'] = $width : '';
25 | isset($height) ? $this->constructorOptions['height'] = $height : '';
26 | isset($renderAt) ? $this->constructorOptions['renderAt'] = $renderAt : '';
27 | isset($dataFormat) ? $this->constructorOptions['dataFormat'] = $dataFormat : '';
28 | isset($dataSource) ? $this->constructorOptions['dataSource'] = $dataSource : '';
29 | }
30 |
31 | //Add event
32 | function addEvent($eventName, $funcName){
33 | isset($eventName) ? $this->eventOptions[$eventName] = $funcName : '';
34 | }
35 |
36 | //Add message
37 | function addMessage($messageName, $messageValue){
38 | isset($messageName) ? $this->constructorOptions[$messageName] = $messageValue : '';
39 | }
40 |
41 | // render the chart created
42 | // It prints a script and calls the FusionCharts javascript render method of created chart
43 | function render() {
44 |
45 | $timeSeries = null;
46 | $tempArray = array();
47 | foreach($this->constructorOptions as $key => $value) {
48 | if ($key === 'dataSource') {
49 | $tempArray['dataSource'] = '__dataSource__';
50 | } else {
51 | $tempArray[$key] = $value;
52 | }
53 | }
54 |
55 | $jsonEncodedOptions = json_encode($tempArray);
56 |
57 | if (is_object($this->constructorOptions['dataSource']))
58 | {
59 | if (get_class($this->constructorOptions['dataSource']) === 'TimeSeries'){
60 | $timeSeries = $this->constructorOptions['dataSource'];
61 | }
62 | } else {
63 |
64 | $dataFormat = $this->constructorOptions['dataFormat'];
65 |
66 | if ($dataFormat === 'json') {
67 | $jsonEncodedOptions = preg_replace('/\"__dataSource__\"/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
68 | } elseif ($dataFormat === 'xml') {
69 | $jsonEncodedOptions = preg_replace('/\"__dataSource__\"/', '\'__dataSource__\'', $jsonEncodedOptions);
70 | $jsonEncodedOptions = preg_replace('/__dataSource__/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
71 | } elseif ($dataFormat === 'xmlurl') {
72 | $jsonEncodedOptions = preg_replace('/__dataSource__/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
73 | } elseif ($dataFormat === 'jsonurl') {
74 | $jsonEncodedOptions = preg_replace('/__dataSource__/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
75 | }
76 | }
77 |
78 | $tempData = preg_replace('/__constructorOptions__/', $jsonEncodedOptions, $this->constructorTemplate);
79 | foreach($this->eventOptions as $key => $value) {
80 | $tempEvtTmp = preg_replace('/__chartId__/', $this->constructorOptions['id'], $this->eventTemplate);
81 | $tempEvtTmp = preg_replace('/_fceventname_/', $key, $tempEvtTmp);
82 | $tempEvtTmp = preg_replace('/_fceventbody_/', $value, $tempEvtTmp);
83 | $tempData .= $tempEvtTmp;
84 | }
85 | $tempData .= preg_replace('/__chartId__/', $this->constructorOptions['id'], $this->renderTemplate);
86 | $renderHTML = preg_replace('/__FC__/', $tempData, $this->baseTemplate);
87 |
88 | if ($timeSeries){
89 | $renderHTML = preg_replace('/__FT__/', $timeSeries->GetDataStore(), $renderHTML);
90 | $renderHTML = preg_replace('/\"__dataSource__\"/', $timeSeries->GetDataSource(), $renderHTML);
91 | }else{
92 | $renderHTML = preg_replace('/__FT__/', '', $renderHTML);
93 | }
94 |
95 | echo $renderHTML;
96 | }
97 |
98 | }
99 |
100 | class TimeSeries {
101 |
102 | private $fusionTableObject = null;
103 | private $attributesList = array();
104 |
105 | function __construct($fusionTable) {
106 | $this->fusionTableObject = $fusionTable;
107 | }
108 |
109 | function AddAttribute($key, $value){
110 | $attribute = array();
111 | $attribute[$key] = $value;
112 | array_push($this->attributesList, $attribute);
113 | }
114 |
115 | function GetDataSource(){
116 | $stringData = '';
117 | $format = '%s:%s,';
118 | foreach ($this->attributesList as $attribute) {
119 | $attribKey = key($attribute);
120 | $stringData .= sprintf($format, $attribKey, $attribute[$attribKey]) . "\r\n";
121 | }
122 | $stringData .= sprintf('%s:%s', 'data', 'fusionTable');
123 |
124 | return "{" . "\r\n" . $stringData . "\r\n" . "}";
125 | }
126 |
127 | function GetDataStore(){
128 | return $this->fusionTableObject->GetDataTable();
129 | }
130 | }
131 |
132 | abstract class OrderBy {
133 | const ASC = 0;
134 | const DESC = 1;
135 | }
136 |
137 | abstract class FilterType {
138 | const Equals = 0;
139 | const Greater = 1;
140 | const GreaterEquals = 2;
141 | const Less = 3;
142 | const LessEquals = 4;
143 | const Between = 5;
144 | }
145 |
146 | class FusionTable {
147 | private $stringData = '';
148 |
149 | function __construct($schema, $data) {
150 | $this->stringData .="let schema = " . $schema . ";\r\n";
151 | $this->stringData .="let data = " . $data . ";\r\n";
152 | $this->stringData .="let fusionDataStore = new FusionCharts.DataStore();\r\n";
153 | $this->stringData .="let fusionTable = fusionDataStore.createDataTable(data, schema);\r\n";
154 | }
155 |
156 | function Select(...$columnName) {
157 | if (count($columnName) > 0 ) {
158 | $selectData = sprintf("'%s'", implode("','", $columnName));
159 | $this->stringData .= "fusionTable = fusionTable.query(FusionCharts.DataStore.Operators.select([" . $selectData . "]));". "\r\n";
160 | }
161 | }
162 |
163 | function Sort($columnName, $columnOrderBy) {
164 | $sortData = sprintf("sort([{column: '%s', order: '%s'}])", $columnName, (OrderBy::ASC === $columnOrderBy) ? "asc" : "desc");
165 | $this->stringData .= "fusionTable = fusionTable.query(" . $sortData . ");". "\r\n";
166 | }
167 |
168 | function CreateFilter($filterType, $columnName, ...$values) {
169 | $filterData = '';
170 | if (count($values) > 0 ) {
171 | $refl = new ReflectionClass('FilterType');
172 | $constants = $refl->getConstants();
173 | $constName = null;
174 | foreach ( $constants as $name => $value )
175 | {
176 | if ( $value == $filterType )
177 | {
178 | $constName = lcfirst($name);
179 | break;
180 | }
181 | }
182 |
183 | if ($constName) {
184 | switch ($filterType) {
185 | case FilterType::Equals:
186 | $filterData = sprintf("FusionCharts.DataStore.Operators.%s('%s','%s')", $constName, $columnName, $values[0]);
187 | break;
188 | case FilterType::Between:
189 | if (count($values) > 1 ) {
190 | $filterData = sprintf("FusionCharts.DataStore.Operators.%s('%s',%s,%s)", $constName, $columnName, $values[0], $values[1]);
191 | }
192 | break;
193 | default:
194 | $filterData = sprintf("FusionCharts.DataStore.Operators.%s('%s',%s)", $constName, $columnName, $values[0]);
195 | }
196 | }
197 | }
198 | return $filterData;
199 | }
200 |
201 | function ApplyFilter($filter) {
202 | if (strlen($filter)>0){
203 | $this->stringData .= "fusionTable = fusionTable.query(" . $filter . ");". "\r\n";
204 | }
205 | }
206 |
207 | function ApplyFilterByCondition($filter) {
208 | if (strlen($filter)>0){
209 | $this->stringData .= "fusionTable = fusionTable.query(" . $filter . ");". "\r\n";
210 | }
211 | }
212 |
213 | function Pipe(...$filters) {
214 | $filterData='';
215 | if (count($filters) > 0 ) {
216 | $filterData = sprintf("%s", implode(",", $filters));
217 | $this->stringData .= "fusionTable = fusionTable.query(FusionCharts.DataStore.Operators.pipe(" . $filterData . "));". "\r\n";
218 | }
219 | }
220 |
221 | function GetDataTable() {
222 | return $this->stringData;
223 | }
224 | }
225 | ?>
226 |
--------------------------------------------------------------------------------
/fusioncharts-wrapper/fusioncharts.php:
--------------------------------------------------------------------------------
1 |
10 | FusionCharts.ready(function () {
11 | __FT__
12 | __FC__
13 | });
14 | ';
15 |
16 | private $constructorTemplate = 'new FusionCharts(__constructorOptions__);';
17 | private $renderTemplate = 'FusionCharts("__chartId__").render();';
18 | private $eventTemplate = 'FusionCharts("__chartId__").addEventListener("_fceventname_",_fceventbody_);';
19 |
20 | // constructor
21 | function __construct($type, $id, $width = 400, $height = 300, $renderAt, $dataFormat= null, $dataSource) {
22 | isset($type) ? $this->constructorOptions['type'] = $type : '';
23 | isset($id) ? $this->constructorOptions['id'] = $id : 'php-fc-'.time();
24 | isset($width) ? $this->constructorOptions['width'] = $width : '';
25 | isset($height) ? $this->constructorOptions['height'] = $height : '';
26 | isset($renderAt) ? $this->constructorOptions['renderAt'] = $renderAt : '';
27 | isset($dataFormat) ? $this->constructorOptions['dataFormat'] = $dataFormat : '';
28 | isset($dataSource) ? $this->constructorOptions['dataSource'] = $dataSource : '';
29 | }
30 |
31 | //Add event
32 | function addEvent($eventName, $funcName){
33 | isset($eventName) ? $this->eventOptions[$eventName] = $funcName : '';
34 | }
35 |
36 | //Add message
37 | function addMessage($messageName, $messageValue){
38 | isset($messageName) ? $this->constructorOptions[$messageName] = $messageValue : '';
39 | }
40 |
41 | // render the chart created
42 | // It prints a script and calls the FusionCharts javascript render method of created chart
43 | function render() {
44 |
45 | $timeSeries = null;
46 | $tempArray = array();
47 | foreach($this->constructorOptions as $key => $value) {
48 | if ($key === 'dataSource') {
49 | $tempArray['dataSource'] = '__dataSource__';
50 | } else {
51 | $tempArray[$key] = $value;
52 | }
53 | }
54 |
55 | $jsonEncodedOptions = json_encode($tempArray);
56 |
57 | if (is_object($this->constructorOptions['dataSource']))
58 | {
59 | if (get_class($this->constructorOptions['dataSource']) === 'TimeSeries'){
60 | $timeSeries = $this->constructorOptions['dataSource'];
61 | }
62 | } else {
63 |
64 | $dataFormat = $this->constructorOptions['dataFormat'];
65 |
66 | if ($dataFormat === 'json') {
67 | $jsonEncodedOptions = preg_replace('/\"__dataSource__\"/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
68 | } elseif ($dataFormat === 'xml') {
69 | $jsonEncodedOptions = preg_replace('/\"__dataSource__\"/', '\'__dataSource__\'', $jsonEncodedOptions);
70 | $jsonEncodedOptions = preg_replace('/__dataSource__/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
71 | } elseif ($dataFormat === 'xmlurl') {
72 | $jsonEncodedOptions = preg_replace('/__dataSource__/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
73 | } elseif ($dataFormat === 'jsonurl') {
74 | $jsonEncodedOptions = preg_replace('/__dataSource__/', $this->constructorOptions['dataSource'], $jsonEncodedOptions);
75 | }
76 | }
77 |
78 | $tempData = preg_replace('/__constructorOptions__/', $jsonEncodedOptions, $this->constructorTemplate);
79 | foreach($this->eventOptions as $key => $value) {
80 | $tempEvtTmp = preg_replace('/__chartId__/', $this->constructorOptions['id'], $this->eventTemplate);
81 | $tempEvtTmp = preg_replace('/_fceventname_/', $key, $tempEvtTmp);
82 | $tempEvtTmp = preg_replace('/_fceventbody_/', $value, $tempEvtTmp);
83 | $tempData .= $tempEvtTmp;
84 | }
85 | $tempData .= preg_replace('/__chartId__/', $this->constructorOptions['id'], $this->renderTemplate);
86 | $renderHTML = preg_replace('/__FC__/', $tempData, $this->baseTemplate);
87 |
88 | if ($timeSeries){
89 | $renderHTML = preg_replace('/__FT__/', $timeSeries->GetDataStore(), $renderHTML);
90 | $renderHTML = preg_replace('/\"__dataSource__\"/', $timeSeries->GetDataSource(), $renderHTML);
91 | }else{
92 | $renderHTML = preg_replace('/__FT__/', '', $renderHTML);
93 | }
94 |
95 | echo $renderHTML;
96 | }
97 |
98 | }
99 |
100 | class TimeSeries {
101 |
102 | private $fusionTableObject = null;
103 | private $attributesList = array();
104 |
105 | function __construct($fusionTable) {
106 | $this->fusionTableObject = $fusionTable;
107 | }
108 |
109 | function AddAttribute($key, $value){
110 | $attribute = array();
111 | $attribute[$key] = $value;
112 | array_push($this->attributesList, $attribute);
113 | }
114 |
115 | function GetDataSource(){
116 | $stringData = '';
117 | $format = '%s:%s,';
118 | foreach ($this->attributesList as $attribute) {
119 | $attribKey = key($attribute);
120 | $stringData .= sprintf($format, $attribKey, $attribute[$attribKey]) . "\r\n";
121 | }
122 | $stringData .= sprintf('%s:%s', 'data', 'fusionTable');
123 |
124 | return "{" . "\r\n" . $stringData . "\r\n" . "}";
125 | }
126 |
127 | function GetDataStore(){
128 | return $this->fusionTableObject->GetDataTable();
129 | }
130 | }
131 |
132 | abstract class OrderBy {
133 | const ASC = 0;
134 | const DESC = 1;
135 | }
136 |
137 | abstract class FilterType {
138 | const Equals = 0;
139 | const Greater = 1;
140 | const GreaterEquals = 2;
141 | const Less = 3;
142 | const LessEquals = 4;
143 | const Between = 5;
144 | }
145 |
146 | class FusionTable {
147 | private $stringData = '';
148 |
149 | function __construct($schema, $data) {
150 | $this->stringData .="let schema = " . $schema . ";\r\n";
151 | $this->stringData .="let data = " . $data . ";\r\n";
152 | $this->stringData .="let fusionDataStore = new FusionCharts.DataStore();\r\n";
153 | $this->stringData .="let fusionTable = fusionDataStore.createDataTable(data, schema);\r\n";
154 | }
155 |
156 | function Select(...$columnName) {
157 | if (count($columnName) > 0 ) {
158 | $selectData = sprintf("'%s'", implode("','", $columnName));
159 | $this->stringData .= "fusionTable = fusionTable.query(FusionCharts.DataStore.Operators.select([" . $selectData . "]));". "\r\n";
160 | }
161 | }
162 |
163 | function Sort($columnName, $columnOrderBy) {
164 | $sortData = sprintf("sort([{column: '%s', order: '%s'}])", $columnName, (OrderBy::ASC === $columnOrderBy) ? "asc" : "desc");
165 | $this->stringData .= "fusionTable = fusionTable.query(" . $sortData . ");". "\r\n";
166 | }
167 |
168 | function CreateFilter($filterType, $columnName, ...$values) {
169 | $filterData = '';
170 | if (count($values) > 0 ) {
171 | $refl = new ReflectionClass('FilterType');
172 | $constants = $refl->getConstants();
173 | $constName = null;
174 | foreach ( $constants as $name => $value )
175 | {
176 | if ( $value == $filterType )
177 | {
178 | $constName = lcfirst($name);
179 | break;
180 | }
181 | }
182 |
183 | if ($constName) {
184 | switch ($filterType) {
185 | case FilterType::Equals:
186 | $filterData = sprintf("FusionCharts.DataStore.Operators.%s('%s','%s')", $constName, $columnName, $values[0]);
187 | break;
188 | case FilterType::Between:
189 | if (count($values) > 1 ) {
190 | $filterData = sprintf("FusionCharts.DataStore.Operators.%s('%s',%s,%s)", $constName, $columnName, $values[0], $values[1]);
191 | }
192 | break;
193 | default:
194 | $filterData = sprintf("FusionCharts.DataStore.Operators.%s('%s',%s)", $constName, $columnName, $values[0]);
195 | }
196 | }
197 | }
198 | return $filterData;
199 | }
200 |
201 | function ApplyFilter($filter) {
202 | if (strlen($filter)>0){
203 | $this->stringData .= "fusionTable = fusionTable.query(" . $filter . ");". "\r\n";
204 | }
205 | }
206 |
207 | function ApplyFilterByCondition($filter) {
208 | if (strlen($filter)>0){
209 | $this->stringData .= "fusionTable = fusionTable.query(" . $filter . ");". "\r\n";
210 | }
211 | }
212 |
213 | function Pipe(...$filters) {
214 | $filterData='';
215 | if (count($filters) > 0 ) {
216 | $filterData = sprintf("%s", implode(",", $filters));
217 | $this->stringData .= "fusionTable = fusionTable.query(FusionCharts.DataStore.Operators.pipe(" . $filterData . "));". "\r\n";
218 | }
219 | }
220 |
221 | function GetDataTable() {
222 | return $this->stringData;
223 | }
224 | }
225 | ?>
226 |
--------------------------------------------------------------------------------
/samples/pages/usa-map-sample.php:
--------------------------------------------------------------------------------
1 |
6 |
7 |
8 |
9 | FusionCharts | USA Map
10 |
11 |
12 |
13 |
19 |
20 |
21 |
22 |
23 | \$lname has an average temperature of \$datavalue\"
35 | },
36 | \"colorrange\": {
37 | \"minvalue\": \"20\",
38 | \"code\": \"#00A971\",
39 | \"gradient\": \"1\",
40 | \"color\": [{
41 | \"minvalue\": \"20\",
42 | \"maxvalue\": \"40\",
43 | \"code\": \"#EFD951\"
44 | }, {
45 | \"minvalue\": \"40\",
46 | \"maxvalue\": \"60\",
47 | \"code\": \"#FD8963\"
48 | },
49 | {
50 | \"minvalue\": \"60\",
51 | \"maxvalue\": \"80\",
52 | \"code\": \"#D60100\"
53 | }
54 |
55 | ]
56 | },
57 | \"data\": [{
58 | \"id\": \"HI\",
59 | \"value\": \"70.0\"
60 | },
61 | {
62 | \"id\": \"DC\",
63 | \"value\": \"52.3\"
64 | },
65 | {
66 | \"id\": \"MD\",
67 | \"value\": \"54.2\"
68 | },
69 | {
70 | \"id\": \"DE\",
71 | \"value\": \"55.3\"
72 | },
73 | {
74 | \"id\": \"RI\",
75 | \"value\": \"50.1\"
76 | },
77 | {
78 | \"id\": \"WA\",
79 | \"value\": \"48.3\"
80 | },
81 | {
82 | \"id\": \"OR\",
83 | \"value\": \"48.4\"
84 | },
85 | {
86 | \"id\": \"CA\",
87 | \"value\": \"59.4\"
88 | },
89 | {
90 | \"id\": \"AK\",
91 | \"value\": \"26.6\",
92 | },
93 | {
94 | \"id\": \"ID\",
95 | \"value\": \"44.4\"
96 | },
97 | {
98 | \"id\": \"NV\",
99 | \"value\": \"49.9\"
100 | },
101 | {
102 | \"id\": \"AZ\",
103 | \"value\": \"60.3\"
104 | },
105 | {
106 | \"id\": \"MT\",
107 | \"value\": \"42.7\"
108 | },
109 | {
110 | \"id\": \"WY\",
111 | \"value\": \"42.0\"
112 | },
113 | {
114 | \"id\": \"UT\",
115 | \"value\": \"48.6\"
116 | },
117 | {
118 | \"id\": \"CO\",
119 | \"value\": \"45.1\"
120 | },
121 | {
122 | \"id\": \"NM\",
123 | \"value\": \"53.4\"
124 | },
125 | {
126 | \"id\": \"ND\",
127 | \"value\": \"40.4\"
128 | },
129 | {
130 | \"id\": \"SD\",
131 | \"value\": \"45.2\"
132 | },
133 | {
134 | \"id\": \"NE\",
135 | \"value\": \"48.8\"
136 | },
137 | {
138 | \"id\": \"KS\",
139 | \"value\": \"54.3\"
140 | },
141 | {
142 | \"id\": \"OK\",
143 | \"value\": \"59.6\"
144 | },
145 | {
146 | \"id\": \"TX\",
147 | \"value\": \"64.8\"
148 | },
149 | {
150 | \"id\": \"MN\",
151 | \"value\": \"41.2\"
152 | },
153 | {
154 | \"id\": \"IA\",
155 | \"value\": \"47.8\"
156 | },
157 | {
158 | \"id\": \"MO\",
159 | \"value\": \"54.5\"
160 | },
161 | {
162 | \"id\": \"AR\",
163 | \"value\": \"60.4\"
164 | },
165 | {
166 | \"id\": \"LA\",
167 | \"value\": \"66.4\"
168 | },
169 | {
170 | \"id\": \"WI\",
171 | \"value\": \"43.1\"
172 | },
173 | {
174 | \"id\": \"IL\",
175 | \"value\": \"51.8\"
176 | },
177 | {
178 | \"id\": \"KY\",
179 | \"value\": \"55.6\"
180 | },
181 | {
182 | \"id\": \"TN\",
183 | \"value\": \"57.6\"
184 | },
185 | {
186 | \"id\": \"MS\",
187 | \"value\": \"63.4\"
188 | },
189 | {
190 | \"id\": \"AL\",
191 | \"value\": \"62.8\"
192 | },
193 | {
194 | \"id\": \"GA\",
195 | \"value\": \"63.5\"
196 | },
197 | {
198 | \"id\": \"MI\",
199 | \"value\": \"44.4\"
200 | },
201 | {
202 | \"id\": \"IN\",
203 | \"value\": \"51.7\"
204 | },
205 | {
206 | \"id\": \"OH\",
207 | \"value\": \"50.7\"
208 | },
209 | {
210 | \"id\": \"PA\",
211 | \"value\": \"48.8\"
212 | },
213 | {
214 | \"id\": \"NY\",
215 | \"value\": \"45.4\"
216 | },
217 | {
218 | \"id\": \"VT\",
219 | \"value\": \"42.9\"
220 | },
221 | {
222 | \"id\": \"NH\",
223 | \"value\": \"43.8\"
224 | },
225 | {
226 | \"id\": \"ME\",
227 | \"value\": \"41.0\"
228 | },
229 | {
230 | \"id\": \"MA\",
231 | \"value\": \"47.9\"
232 | },
233 | {
234 | \"id\": \"CT\",
235 | \"value\": \"49.0\"
236 | },
237 | {
238 | \"id\": \"NJ\",
239 | \"value\": \"52.7\"
240 | },
241 | {
242 | \"id\": \"WV\",
243 | \"value\": \"51.8\"
244 | },
245 | {
246 | \"id\": \"VA\",
247 | \"value\": \"55.1\"
248 | },
249 | {
250 | \"id\": \"NC\",
251 | \"value\": \"59.0\"
252 | },
253 | {
254 | \"id\": \"SC\",
255 | \"value\": \"62.4\"
256 | },
257 | {
258 | \"id\": \"FL\",
259 | \"value\": \"70.7\"
260 | }
261 | ]
262 | }";
263 |
264 | // chart object
265 | $Chart = new FusionCharts("maps/usa", "map-1" , "700", "400", "map-container", "json", $mapData);
266 |
267 | // Render the chart
268 | $Chart->render();
269 |
270 | ?>
271 |
272 | USA Map
273 | Chart will render here!
274 |
275 |
276 | Go Back
277 |
278 |
279 |
--------------------------------------------------------------------------------