Sales map with the FusionCharts library

In this example, we will use the Fusion Charts library to display a heat map of sales made.

1 – Create a Blank application.

2 – We proceed to create an external library

3 – Create a new library at the project level, called “fusioncharts_sample” (1). Click on the “Use library” button (2), save it to the project (3) and then click on the option to “edit” the library (4).

4 – Once we obtain the code from the external library, we proceed to create two files, one .js and another .php

maps.php

<? php 

function getChartSQL () 
{ 
// fusionchart key 
// label 
// chart type map 
// the value itself 
if (isset ($ _ GET ['map']) && isset ($ _ GET ['region']) && isset ($ _GET ['country'])) 
{ 
$ str_sql = " 
SELECT 
   states.fs_id, 
   states.statename,    
   states.statename, 
   SUM (orders.priceorder) 
FROM 
   orders INNER JOIN customers ON orders.customerid = customers.customerid 
   INNER JOIN states ON customers.stateid = states.stateid 
   INNER JOIN country ON customers.country = country.iso 
   INNER JOIN country_region ON country.country_region = country_region.regionid 
WHERE
country_region.short_label = \ "". str_replace ('"'," \ "", $ _GET ['region']). "\" AND 
    country.fs_id = \ "". str_replace ('"'," \ "", $ _GET ['country']). "\" 
GROUP BY 
   states.stateid, 
   states.statename,    
   states.statename 
"; 
} 
elseif (isset ($ _ GET ['map']) && isset ($ _ GET ['region'])) 
{ 
$ str_sql =" 
SELECT 
   country .fs_id, 
   country.printable_name,    
   country.fs_map, 
   SUM (orders.priceorder) 
FROM 
   orders INNER JOIN customers ON orders.customerid = customers.customerid 
   INNER JOIN states ON customers.stateid = states.stateid 
   INNER JOIN country ON customers.country = country.iso
   INNER JOIN country_region ON country.country_region = country_region.regionid 
WHERE 
    country_region.short_label = \ "". str_replace ('"'," \ "", $ _GET ['region']). "\" 
GROUP BY 
   country.fs_id, 
   country.printable_name,    
   country.fs_map 
"; 
} 
else 
{ 
$ str_sql =" 
SELECT 
   country_region.short_label, 
   country_region.label, 
   country_region.fs_map, 
   SUM (orders.priceorder) 
FROM 
   orders INNER JOIN customers ON orders.customerid = customers.customerid 
   INNER JOIN states ON customers.stateid = states.stateid 
   INNER JOIN country ON customers.country = country.iso
   INNER JOIN country_region ON country.country_region = country_region.regionid 
GROUP BY 
   country_region.short_label, 
   country_region.label, 
   country_region.fs_map 
"; 
} 

return $ str_sql; 
} 

function getChartMapType () 
{ 
if (isset ($ _ GET ['map'])) 
{ 
return $ _GET ['map']; 
} 
else 
{ 
return "world"; 
} 
} 

function getChartData ($ rs) 
{ 
$ arr_data = array (); 

$ arr_data ['min'] = 0; 
$ arr_data ['max' ] = 0; 
$ arr_data ['data'] = ""; 

foreach ($ rs as $ row) 
{ 
$ link = "";
if (isset ($ _ GET ['map']) && isset ($ _ GET ['region']) && isset ($ _ GET ['country'])) 
{ 

} 
elseif (isset ($ _ GET ['map']) && isset ($ _ GET ['region'])) 
{ 
$ link = "? map =". $ row [2]. "& region =". $ _GET ['region']. "& Country =". $ row [0]. "& last_map =". $ _GET ['map']; 
} 
else 
{ 
$ link = "? map =". $ row [2]. "& region =". $ row [0]; 
} 

if ($ row [3]> $ arr_data ['max']) 
{ 
$ arr_data ['max'] = $ row [3]; 
} 

$ arr_data ['data']. = '{ 
                     "id": "'. $ row [0]. '",
                     "displayValue": "'. $ row [1].'", 
                     "showLabel": "1", 
                     "value": "'. $ row [3].'",
"link": "'. $ link.'", 
                 }, '; 
} 
return $ arr_data; 
} 

function getHtmlBackButton ($ strLang) 
{ 
if (isset ($ _ GET ['last_map']) && isset ($ _ GET ['region']) && isset ($ _ GET ['country'])) 
{ 
return "<a id = 'back' href = '? map = ". $ _GET ['last_map']. "& Region =". $ _GET ['region']. "'>". $ strLang. "</a>"; 
} 
elseif (isset ($ _ GET ['map']) && isset ($ _ GET ['region'])) 
{ 
return "<a id='back' href='?'>". $ strLang. "</a>"; 
} 
else 
{ 
return ""; 
} 
}

maps.js

function drawMap (strChartType, strChartTitle, strChartSubTitle, minValue, avgValue, MaxValue, jsonData) 
{ 
    FusionCharts.ready (function () { 
        var populationMap = new FusionCharts ({ 
            type: 'maps /' + strChartType, 
            renderAt: 'chart-container', 
            width: '100%', 
            height: '100%', 
            dataFormat: 'json', 
            dataSource: { 
                "chart": { 
                    "caption": strChartTitle, 
                    "subcaption": strChartSubTitle, 
                    "theme": "fint", 
                    "formatNumberScale ":" 0 ",
                    "showLabels": "1",
                    "nullEntityColor": "# C2C2D6", 
                    "nullEntityAlpha": "50", 
                    "hoverOnNull": "0", 
                    "useSNameInLabels": "0", 
                    "entityFillColor": "# A8A8A8", 
                    "entityFillHoverColor": "# E5E5E9" , 
"canvasBorderColor": "# FFFFFF", 
"borderColor": "# 808080" 
                }, 
                "colorrange": { 
                    "startlabel": "Low", 
                    "endlabel": "High", 
                    "code": "# e44a00 ", 
                    " minvalue ": minValue, 
                    " gradient ":" 1 ", 
                    " color ": [{
                        "maxvalue": avgValue, 
                        "displayvalue": "Average", 
                        "code": "# f8bd19" 
                    }, { 
                        "maxvalue": MaxValue, 
                        "code": "# 6baa01" 
                    }] 
                }, 
        
                "data": jsonData, 
            } 
        }); 
     populationMap.render (); 
    }); 
}
 

5 – We proceed to use the sc_include_lib () macro to call the external library within the onExecute event of the blank application.

6 – We use the following code to then create the map.

sc_include_library ("prj", "fusioncharts_sample", "maps.php", true, true); 
$ str_sql = getChartSQL (); 
sc_lookup (rs, $ str_sql); 
$ json_data = getChartData ({rs}); 
?> 
 
 
     <? php echo {lang_maps_title}; ?> 

     sc_include_lib ("fusioncharts"); 
     "> 
     json_data = [<? php echo $ json_data ['data'];?>]; langs = [" <? php echo {lang_maps_subs_low}; ?> "," <? php echo {lang_maps_subs_avg}; ?> "," <? php echo {lang_maps_subs_high}; ?> "]; drawMap ('<? php echo getChartMapType ();?>'," <? php echo {lang_maps_title};?> "," <? php echo {lang_maps_subtitle};?> ", '<? php echo $ json_data ['min'];?> ',' <? php echo ($ json_data ['max']) / 2; ?> ',' <? php echo $ json_data ['max']; ?> ', json_data, langs); 
 <style>     a#back{         border: 1px solid #e4d9c1;         border-radius: 5px;         padding: 5px 8px;         position: fixed;         right: 15px;         top: 20px;         background: #e4d9c1;         *text-transform: uppercase;         font-family: sans-serif;         font-size: 12px;         color: #555;         text-decoration: none;         font-weight: bold;     }     a#back:hover{         text-decoration: underline;     } </style>
 
 
     
A world map will load here! 
 
     

 
 
<? php

7 – Finally, we run the application.

Tutorials in the same category

Integration with WhatsApp

To integrate WhatsApp with ScriptCase, we will be using a specific API called Chat-API, it is a...

Tutorial: Blank Application

In this example a Blank application will be created, using for example jquery code to create an acc...

Using the Paypal and Pagseguro API

1 - We create an application of the grid type 2 - We edit the following fields and create a ...

Send multiple SMS with the sc_send_sms macro

In this example we will be seeing how we can create an application that helps us send multiple mess...

Comment this post