HMJasmi

Members
  • Content count

    2
  • Joined

  • Last visited

About HMJasmi

  • Rank
    Forum Newbie
  1. Hello I got it solved by fixing the app.js I was missing async: false, data: {}, dataType: "json",
  2. I followed https://www.dropbox.com/s/jtpy457k08aoidt/stackedcolumn_plot_mysql_jquery.zip?dl=0 I added App.js $(function(){ $.ajax({ url: 'http://localhost/Data.php', type: 'GET', success : function(data) { categories = (data.categories); dataset = (data.dataset); var chartProperties = { "caption": "Eye Contact Bar Chart", "xAxisname": "Attempt", "yAxisName": "Time (In Seconds)", "numberPrefix": "", "plotFillAlpha": "80", //Cosmetics "paletteColors": "#0075c2,#1aaf5d", "baseFontColor": "#333333", "baseFont": "Helvetica Neue,Arial", "captionFontSize": "14", "subcaptionFontSize": "14", "subcaptionFontBold": "0", "showBorder": "0", "bgColor": "#ffffff", "showShadow": "0", "canvasBgColor": "#ffffff", "canvasBorderAlpha": "0", "divlineAlpha": "100", "divlineColor": "#999999", "divlineThickness": "1", "divLineIsDashed": "1", "divLineDashLen": "1", "divLineGapLen": "1", "usePlotGradientColor": "0", "showplotborder": "0", "valueFontColor": "#ffffff", "placeValuesInside": "1", "showHoverEffect": "1", "rotateValues": "1", "showXAxisLine": "1", "xAxisLineThickness": "1", "xAxisLineColor": "#999999", "showAlternateHGridColor": "0", "legendBgAlpha": "0", "legendBorderAlpha": "0", "legendShadow": "0", "legendItemFontSize": "10", "legendItemFontColor": "#666666" }, apiChart = new FusionCharts({ type: 'mscolumn2d', renderAt: 'chart-container', width: '550', height: '350', dataFormat: 'json', dataSource: { "chart": chartProperties, "categories": categories, "dataset": dataset, } }); apiChart.render(); } }); }); Also I added this html file <!DOCTYPE html> <html> </body> <div id="chart-container">Chart will render here</div> <script src="jquery/jquery-3.1.1.min.js"></script> <script src="jquery/jquery-ui.min.js"></script> <script type="text/javascript" src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script> <script type="text/javascript" src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js?cacheBust=56"></script> <script src="js/fusioncharts.charts.js"></script> <script src="App.js"></script> </body> </html> What I am getting from Data.php is {"categories":[{"category":[{"label":""},{"label":""},{"label":""}]}],"dataset":[{"seriesName":"Is Eye Contact","data":[{"value":"10.01"},{"value":"5.02"},{"value":"10.21"}]},{"seriesName":"Not Eye Contact","data":[{"value":"3.04"},{"value":"4.34"},{"value":"5.32"}]}]} After all of this the chart is not rendering I coppied the above JSON object (and I removed the first and the last curly bracket) to the normal html sample (available at https://www.fusioncharts.com/dev/chart-guide/multi-series-charts/creating-multi-series-charts.html) and it worked completely fine. How can I match the json object with what is required by the chart? (I am not a computer engineering student :'))