Search the Community

@version fusioncharts/3.3.1-sr2.19840 Chart type: Javascript Chart data: json Uses FusionCharts/updatepanelhook.fusioncharts.js for ajax loads On ajax load randomly starts having below exception . However once error starts, restarting the azure instance is the only option. Object reference not set to an instance of an object. Stack trace: at InfosoftGlobal.FusionCharts.FC_Transform(Hashtable arr, String tFormat, Boolean ignoreBlankValues) at InfosoftGlobal.FusionCharts.FC_EncodeJSON(Hashtable json, Boolean enclosed) at InfosoftGlobal.FusionCharts.RenderChartALL(String chartSWF, String dataUrl, String dataStr, String chartId, String chartWidth, String chartHeight, Boolean debugMode, Boolean registerWithJS, Boolean allowTransparent, String bgColor, String scaleMode, String language) at InfosoftGlobal.FusionCharts.RenderChart(String chartSWF, String dataUrl, String dataStr, String chartId, String chartWidth, String chartHeight, Boolean debugMode, Boolean registerWithJS) at SIBlue.home.RenderChart(String dataStr, String chartId) at SIBlue.home.Display_Shock_Graph() How do we handle this exception, with out restarting the azure instance.

Hi Team, We want to use Fusionchart for displaying a Timeline Chart. The timeline chart is going to contain both time and description. Whenever we hover on the chart for that particular time the description has to be displayed . Please suggest possible fusion charts that can be implemented using Angular7. Please refer below link for d3-Timeline chart which is close to our requirement. https://www.npmjs.com/package/d3-timelines Regards, Surekha.

Hi. I have a requirement to add some text on the bottom of the chart, I tried by adding text into watermark text place . its a lengthier text, so it can't be fully visible at the bottom, could not able to split the text into 3 lines. is anyone knows please help me? please advice me on this, little urgent. thanks in advance

I need to remove the dollar ($) sign from the top of the first bar which is showing the values $410K,only we need 410K https://jsfiddle.net/TumnU/1489/

i have created a 3d column chart in asp.net using fusion chart , i want to implement drill down in to the same .that means while clicking the column of the chart want to display a pop up window . for that i want to pass some parameter as query string my code sample is below xmlData.AppendFormat("<set name='{0}' value='{1}' link='P - Details_IncidentByType, width = 400, height = 300, toolbar = no, scrollbars = no, resizable = no -/Details_IncidentByTypeaspx.aspx %SD=" + ToDate+ "%ED="+FromDate+ "%TYP="+ QS_Type + " %CPNY="+QS_Company+ " %LOC="+QS_Location+ " " % FM="+QS_Frompage+" '''/>", Dt.Rows["bbbb"], Dt.Rows["aaaa"]); i have urgent requirement on this , please anybody help . Kindly advice on this thanks in advance.

Hi, I am using FusionCharts XT(v3.2.2) SR2 licensed version. Very recently while working on loading Pie chart in one of our application we are faced a problem, where Pie chart is not being loaded but all the legends and labels with values are loaded successfully. Please find the screenshot attached. Earlier in our project we are used to fusion chart, where javascript code were included within <script> tag in the JSP, where as now we are trying to separate Javascript code in a file. Please find the Javascript and JSP below. FusionCharts.js is loaded in the main JSP and code is as below. <script id="/js/fusionChart/FusionCharts.js" language="Javascript" src="/js/fusionChart/FusionCharts.js"></script> Javascript: ======================================== var ChartSummary = function() { this.loadChart = function() { FusionCharts.setCurrentRenderer('javascript'); var pieChart = new FusionCharts(project + '/FusionCharts/Pie3D.swf', 'chart1ID', '500', '500'); pieChart.setDataXML("<chart showValues='1' showLegend='1' rotateValues='1' showNames='1' pieYScale='90' pieSliceDepth='10' pieRadius='120' showPercentageValues='1' decimalPrecision='0' showBorder='1' borderColor='000000' bgColor='FFFFFF' baseFontSize='10' baseFont='Arial'> <set value='145517' color='008000' label='Approved' /> <set value='0' color='ff0000' label='Rejected' /> <set value='103' color='ffff00' label='Pending' /> </chart>"); pieChart.setTransparent(true); pieChart.render('chartDiv'); } }; var chartSummary = new ChartSummary(); JSP =================================================== <div> <form name="chartForm" id="chartForm"> <table style="width:100%;"> <tr> <td> <div id="LoadChartButton" style="float: right;padding: 1%"> <input type="button" value="Load Chart" onclick="chartSummary.loadChart();"> </div> </td> </tr> <tr> <td> <div id="chartDiv" name="chartDiv"></div> </td> </tr> </table> </form> </div> Image =====================

Hi all, i have try to implement a treemap chart but in fields value i have negative data. I have see in official documents that a negative value is use in a sValue field, is true? I can't use negative data in value field? Thank you all for your help. This is my json file: "data":[ [ { "label":"Macrocategoria", "fillcolor":"8c8c8c", "value":100, "data":[ { "label":"Azionario", "value":69, "data":[ { "label":"Titolo 5", "value":"40,0%", "sValue":"5,0%" }, { "label":"Titolo 6", "value":"18,0%", "sValue":"6,0%" }, { "label":"Titolo 7", "value":"-2,0%", "sValue":"7,0%" }, { "label":"Titolo 8", "value":"13,0%", "sValue":"8,0%" } ] }, { "label":"Obbligazionario", "value":31, "data":[ { "label":"Titolo 1", "value":"10,0%", "sValue":"1,0%" }, { "label":"Titolo 2", "value":"5,0%", "sValue":"2,0%" }, { "label":"Titolo 3", "value":"15,0%", "sValue":"3,0%" }, { "label":"Titolo 4", "value":"1,0%", "sValue":"4,0%" } ] } ] } ] ], "colorrange":{ "mapbypercent":"1", "gradient":"1", "minvalue":"1,0%", "code":"6da81e", "startlabel":"Decline", "endlabel":"Rise", "color":[ { "code":"ffffff", "maxvalue":4, "label":"Static" }, { "code":"e24b1a", "maxvalue":"8,0%", "label":"AVERAGE" } ] }

Hi Team, I am not able to generate the angular chart if the scope variables are present inside the HTTP request. Thanks in advance . If the scope is available outside http it works perfect. Thanks . Any help on this is appreciated Html <html ng-app="HelloApp"> <body ng-controller="MyController"> {{myDataSource1}} <div > <fusioncharts id="mychartcontainer" chartid="mychart" width="400" height="200" type="column2d" datasource="{{myDataSource}}" ></fusioncharts> </div> </body> </html> JS var app = angular.module('HelloApp', ["ng-fusioncharts"]); app.controller('MyController', function ($scope,$http) { var req='Any Rest URL'; $http({ method: 'GET', url: req }).then(function successCallback(response) { //var data=[]; alert("test"); $scope.myDataSource1="nretes" $scope.myDataSource = { chart: { caption: "Harry's SuperMart", subCaption: "Top 5 stores in last month by revenue", numberPrefix: "$" }, data: [{ label: "Bakersfield Central", value: "880000" }, { label: "Garden Groove harbour", value: "730000" }, { label: "Los Angeles Topanga", value: "590000" }, { label: "Compton-Rancho Dom", value: "520000" }, { label: "Daly City Serramonte", value: "330000" }] }; }, function errorCallback(response) { $scope.Status="failed"; // $scope.Results=gems; //$scope.gridOptions.data= gems; alert("failure"); }); });

hi, i have attached 2 images the TARGET CHART and the RENDER CHART. some configuration in fusion charts are not working or i am doing it the wrong way please help me i will give the detailed problems and i will also give the codes that i used to render my chart 1. show x-axis and y-axis tick marks - as shown in target chart 2. show vertical lines seperating the datas - as shown in target chart 3. make the x-axis and y-axis lines thicker 4. remove the % sign in line graph - as shown in target chart - as shown in target chart 5. i cannot predict the values of good sockets and total socket my chart primary y-axis has no allowance it doesn't look good how can i give ample allowance to the primary y-axis - as shown in target chart Thank You so much for the immediate response....................... below is the codes i used for the RENDERED CHART FusionCharts.ready(function(){ var myChart = new FusionCharts({ "type": "msstackedcolumn2dlinedy", "renderAt": "kamote", "width": 900, "height": 400, "dataFormat": "json", "dataSource": { "chart": { "caption": "Burn-In Board", "pYAxisName": "# of Sockets", "pYAxisNameFontSize": "12", "pYAxisNameFonBold": "1", "sYAxisName": "Effieciency %", "sYAxisNameFontSize": "12", "sYAxisNameFonBold": "1", "sYAxisMaxValue": "100", "captionFont": "Arial", "yAxisNameFont": "Arial", "xAxisNameFont": "Arial", "xAxisNameFontSize": "14", "xAxisNameFontBold": "1", "paletteColors": "#8C54AE, #2FBDF2", "xAxisname": "Period", "showAlternateHGridColor": "1", "lineColor": "#00FF97", "lineThickness": "3", "anchorRadius": "5", "anchorBgColor": "#FFFF99", "captionPadding": "40", "captionFontSize": "20", "valueFontBold": "1", "valueBgColor": "#F6F6F6", "valueBgAlpha": "70", "showValues": "0", "showXAxisLine": "1", "xAxisLineColor": "#000000", "showYAxisLine": "1", "sNumberSuffix": "%", "theme": "fint" }, "categories": [ { "category": [ { "label": "Q4'14" }, { "label": "Q1'15" }, { "label": "Q2'15" }, { "label": "Q3'15" }, { "label": "W21'15" }, { "label": "W22'15" }, { "label": "W23'15" }, { "label": "W24'15" }, { "label": "W25'15" }, { "label": "W26'15" }, { "label": "W27'15" }, { "label": "W28'15" }, { "label": "W29'15" }, { "label": "W30'15" }, { "label": "W31'15" }, { "label": "W32'15" }, { "label": "W33'15" } ] } ], "dataset": [ { "dataset": [ { "seriesname": "Total Sockets", "data": [ { "value": "1221049.4615" }, { "value": "1173513.2308" }, { "value": "1155593.6154" }, { "value": "628820.9231" }, { "value": "1187270" }, { "value": "1202420" }, { "value": "1204906" }, { "value": "1207542" }, { "value": "1207542" }, { "value": "1207758" }, { "value": "1207878" }, { "value": "1210392" }, { "value": "1213952" }, { "value": "1221539" }, { "value": "1222639" }, { "value": "1223803" }, { "value": "874469" } ] } ] }, { "dataset": [ { "seriesname": "Good Sockets", "data": [ { "value": "1205036.7692" }, { "value": "1157653.9231" }, { "value": "1139448.4615" }, { "value": "620454.3077" }, { "value": "1170948" }, { "value": "1186091" }, { "value": "1188573" }, { "value": "1191204" }, { "value": "1191204" }, { "value": "1191420" }, { "value": "1191540" }, { "value": "1194054" }, { "value": "1197614" }, { "value": "1205273" }, { "value": "1206609" }, { "value": "1207787" }, { "value": "863029" } ] } ] } ], "lineset": [ { "seriesname": "Effieciency", "showValues": "1", "data": [ { "value": "98.6886" }, { "value": "98.6486" }, { "value": "98.6029" }, { "value": "98.6695" }, { "value": "98.6252" }, { "value": "98.6420" }, { "value": "98.6445" }, { "value": "98.6470" }, { "value": "98.6470" }, { "value": "98.6472" }, { "value": "98.6474" }, { "value": "98.6502" }, { "value": "98.6541" }, { "value": "98.6684" }, { "value": "98.6889" }, { "value": "98.6913" }, { "value": "98.6918" } ] } ] } }); myChart.render(); });

Dear All, I have one JSP Page which include simple Heat Chart, I found one problem that if we use <base ..> html tag that chart not getting render properly. JSP Code: <!DOCTYPE html> <%@ page isThreadSafe="false"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <html> <head> <base href="<%=basePath%>" /> <title>Buzzor</title> <script type="text/javascript" src="js/fusioncharts/fusioncharts.js"></script> <script type="text/javascript"> FusionCharts.ready(function () { var salesHMChart = new FusionCharts({ type: 'heatmap', renderAt: 'chart-container', width: '550', height: '270', dataFormat: 'json', dataSource: { "chart": { "caption": "Top Smartphone Ratings", "subcaption": "By Features", "xAxisName":"Features", "yAxisName":"Model", "showplotborder": "1", "xAxisLabelsOnTop": "1", "plottooltext":"<div id='nameDiv' style='font-size: 12px; border-bottom: 1px dashed #666666; font-weight:bold; padding-bottom: 3px; margin-bottom: 5px; display: inline-block; color: #888888;' >$rowLabel :</div>{br}Rating : <b>$dataValue</b>{br}$columnLabel : <b>$tllabel1</b>{br}<b>$trLabel</b>", "theme" : "carbon" }, "rows": { "row": [ { "id": "SGS5", "label": "Samsung Galaxy S5" }, { "id": "HTC1M8", "label": "HTC One (M8)" }, { "id": "IPHONES5", "label": "Apple iPhone 5S" }, { "id": "LUMIA", "label": "Nokia Lumia 1520" } ] }, "columns": { "column": [ { "id": "processor", "label": "Processor" }, { "id": "screen", "label": "Screen Size" }, { "id": "price", "label": "Price" }, { "id": "backup", "label": "Battery Backup" } , { "id": "cam", "label": "Camera" } ] }, "dataset": [ { "data": [ { "rowid": "SGS5", "columnid": "processor", "value": "8.7", "tllabel1": "Quad Core 2.5 GHz", "trlabel": "OS : Android 4.4 Kitkat" }, { "rowid": "SGS5", "columnid": "screen", "value": "8.5", "tllabel1": "5.1 inch", "trlabel": "AMOLED screen" }, { "rowid": "SGS5", "columnid": "price", "value": "9.3", "tllabel1": "$600" }, { "rowid": "SGS5", "columnid": "backup", "value": "9.7", "tllabel1": "29 Hrs", "trlabel": "Battery : 2800 MAH" }, { "rowid": "SGS5", "columnid": "cam", "value": "8", "tllabel1": "16 MP", "trlabel": "Front Camera : 2.1 MP" }, { "rowid": "HTC1M8", "columnid": "processor", "value": "9.2", "tllabel1": "Quad Core 2.3 GHz", "trlabel": "OS : Android 4.4 Kitkat" }, { "rowid": "HTC1M8", "columnid": "screen", "value": "8.3", "tllabel1": "5 inch", "trlabel": "LCD screen" }, { "rowid": "HTC1M8", "columnid": "price", "value": "7.3", "tllabel1": "$600" }, { "rowid": "HTC1M8", "columnid": "backup", "value": "8.8", "tllabel1": "20 Hrs", "trlabel": "Battery : 2600 MAH" }, { "rowid": "HTC1M8", "columnid": "cam", "value": "8.7", "tllabel1": "4 MP", "trlabel": "Front Camera : 5 MP" }, { "rowid": "IPHONES5", "columnid": "processor", "value": "9.1", "tllabel1": "Dual Core", "trlabel": "OS : iOS 7" }, { "rowid": "IPHONES5", "columnid": "screen", "value": "8.6", "tllabel1": "4 inch", "trlabel": "Retina LCD screen" }, { "rowid": "IPHONES5", "columnid": "price", "value": "7.2", "tllabel1": "$649" }, { "rowid": "IPHONES5", "columnid": "backup", "value": "8.4", "tllabel1": "10 Hrs", "trlabel": "Battery : 1560 MAH" }, { "rowid": "IPHONES5", "columnid": "cam", "value": "9.5", "tllabel1": "8 MP", "trlabel": "Front Camera : 1.2 MP" }, { "rowid": "LUMIA", "columnid": "processor", "value": "8.8", "tllabel1": "Quad Core 2.2 GHz", "trlabel": "OS: Windows Phone 8" }, { "rowid": "LUMIA", "columnid": "screen", "value": "9.1", "tllabel1": "6 inch", "trlabel": "LCD screen" }, { "rowid": "LUMIA", "columnid": "price", "value": "9.7", "tllabel1": "$470" }, { "rowid": "LUMIA", "columnid": "backup", "value": "9.2", "tllabel1": "27 Hrs", "trlabel": "Battery : 3400 MAH" }, { "rowid": "LUMIA", "columnid": "cam", "value": "8.1", "tllabel1": "20MP", "trlabel": "Front Camera : 1.2 MP" } ] } ], "colorrange": { "gradient": "0", "minvalue": "0", "code": "E24B1A", "startlabel": "Poor", "endlabel": "Good", "color": [ { "code": "E24B1A", "minvalue": "1", "maxvalue": "5", "label": "Bad" }, { "code": "F6BC33", "minvalue": "5", "maxvalue": "8.5", "label": "Average" }, { "code": "6DA81E", "minvalue": "8.5", "maxvalue": "10", "label": "Good" } ] } } }); salesHMChart.render('chart-container'); }); </script> </head> <body> <div id='chart-container'>FusionCharts XT will load here!</div> </body> </html> Please guide me why its create a problem if i use base tag of html. if i remove base tag that its working fine. I need to know that it the alternative solution for resolving this problem. I have also attached sample output of chart Thanks in Advance

Hi, I am using Javascript driven fusion chart of type "MSLine" there are 5 types of data visible on the graph among which for 3 types of data line representation is fine , but for 2 types of data I want to show only circles, so I am thinking to hide the line between two data plots .I tried various ways but could not hide the lines. Is my approach is correct or there is another way to do so . PFA for my requirement Someone can pls help me to resolve this issue ???

I using FusionChart with asp.net. In implementation i hiting to server with ajax through which i get JSOn in response and i simply pass the json in datasource of fusion chart. Fusion chart is prepared successfully but in second time fusion chart in prepared but the output chart lost its own height and width. why is this so i can't understand. Following code i use <div id="dvGraph" style="width: 800px; height: 300px;"> </div> <input type="button" value="click me" onclick="GetChartData()"/> function GetChartData(){ var postURL = 'abc.aspx?data=PopUp'; $.ajax({ type: "POST", url: postURL, contentType: "application/json;charset=utf-8", dataType: "json", cache: false, beforeSend: function () { }, success: function (response) { var strJson = response.ChartParams[0]; RenderChart(strJson); }, error: function (msg) { ShowErrorMessage(msg); } }); } function RenderChart(strJson) { var uniqueId = GetUniqueId(); // Like dv_5kF7e var myChart = new FusionCharts("MSCombiDY2D", uniqueId, "800", "320", "0", "1"); myChart.setJSONData(strJson); myChart.render("dvGraph"); } it work on first time with actual width:800 and hegiht: 320 but after that its not getting its actual height and width. Please refer Image1.jpg its good but after that height and width not working. But i regularly set height and width by calling RenderChart method. .

I want to execute javascript function that will return a tabular structure view on tooltip. But the following code is not executable. <set value='1.42' tooltext='javascript:showTooltip(100,200);'/> How can i do this. So please try to explain the javascript execution on toolText of javascript.

Hi All, I have been working on this issue since a long time and I didn't find any solution. I have downloaded free version of fusion chart and used pie chart. It is not working in Mozilla FireFox 13 and just showing progress bar. Please see the attachment for the reference. Can anyone help me? Thanks in Advance. Dhaval Panchal

Hi All, I have integrated Fusion chart trail version to My cakephp project and I have passed the datas from database to fusion charts. Its working fine. But when I click on year which is goes to Month, In that I didn't get back button. How can I integrate the Back Button.Please advice me. Thanks in Advance.