Tumbleweed Report post Posted March 23, 2014 { "response": { "version":"0.1", "termsofService":"http://www.wunderground.com/weather/api/d/terms.html", "features": { "conditions": 1 } } , "current_observation": { "image": { "url":"http://icons-ak.wxug.com/graphics/wu2/logo_130x80.png", "title":"Weather Underground", "link":"http://www.wunderground.com" }, "display_location": { "full":"Yorktown, VA", "city":"Yorktown", "state":"VA", "state_name":"Virginia", "country":"US", "country_iso3166":"US", "zip":"23690", "magic":"1", "wmo":"99999", "latitude":"37.22531891", "longitude":"-76.52363586", "elevation":"28.00000000" }, "observation_location": { "full":"York County, Virginia, Yorktown, Virginia", "city":"York County, Virginia, Yorktown", "state":"Virginia", "country":"US", "country_iso3166":"US", "latitude":"37.182751", "longitude":"-76.470512", "elevation":"8 ft" }, "estimated": { }, "station_id":"KVAYORKT2", "observation_time":"Last Updated on March 23, 5:51 PM EDT", "observation_time_rfc822":"Sun, 23 Mar 2014 17:51:27 -0400", "observation_epoch":"1395611487", "local_time_rfc822":"Sun, 23 Mar 2014 17:52:07 -0400", "local_epoch":"1395611527", "local_tz_short":"EDT", "local_tz_long":"America/New_York", "local_tz_offset":"-0400", "weather":"Light Rain", "temperature_string":"37.2 F (2.9 C)", "temp_f":37.2, "temp_c":2.9, "relative_humidity":"93%", "wind_string":"From the NNE at 3.0 MPH Gusting to 7.0 MPH", "wind_dir":"NNE", "wind_degrees":22, "wind_mph":3.0, "wind_gust_mph":"7.0", "wind_kph":4.8, "wind_gust_kph":"11.3", "pressure_mb":"1017", "pressure_in":"30.03", "pressure_trend":"0", "dewpoint_string":"35 F (2 C)", "dewpoint_f":35, "dewpoint_c":2, "heat_index_string":"NA", "heat_index_f":"NA", "heat_index_c":"NA", "windchill_string":"37 F (3 C)", "windchill_f":"37", "windchill_c":"3", "feelslike_string":"37 F (3 C)", "feelslike_f":"37", "feelslike_c":"3", "visibility_mi":"6.0", "visibility_km":"9.7", "solarradiation":"56", "UV":"0","precip_1hr_string":"-999.00 in ( 0 mm)", "precip_1hr_in":"-999.00", "precip_1hr_metric":" 0", "precip_today_string":"0.11 in (3 mm)", "precip_today_in":"0.11", "precip_today_metric":"3", "soil_temp_f": "0.0", "soil_moisture": "0.0", "leaf_wetness": "0.0", "icon":"rain", "icon_url":"http://icons-ak.wxug.com/i/c/k/rain.gif", "forecast_url":"http://www.wunderground.com/US/VA/Yorktown.html", "history_url":"http://www.wunderground.com/weatherstation/WXDailyHistory.asp?ID=KVAYORKT2", "ob_url":"http://www.wunderground.com/cgi-bin/findweather/getForecast?query=37.182751,-76.470512" } } I've been reading and trying for about 5 days now, to learn about populating charts with data pulled from a source and I give up. I consider myself to be a less than fair at coding but I try to take things I find on this forum and other places and piece them together to make something work. So far I have failed miserably. I am trying to produce a single chart (Single Series Column 2D or anything) that displays temperature for my area. I would like to pull the temperature from a local WUNDERGROUND spot for display on a Dashboard I am creating. The data for the other charts on my Dashboard are static .xml files and they all work well. Where I need help is writing the code for a SSC2D chart using the data I pull using the WUNDERGROUND json file. Above is the json file. The data I need for the VALUE is under "current_observation" "temp_f". I would truly appreciate any help you could offer. I am a registered owner of FusionCharts XT and therefore would like to use a chart from that package. Once again, Thanks! Rudy Share this post Link to post Share on other sites
Bindhu Report post Posted March 24, 2014 Hi Rudy, Please find the code below, <html> <head> <title>My First chart using FusionCharts XT - using XML data embedded in the page</title> <script type="text/javascript" src="Charts/FusionCharts.js"></script> </head> <body> <div id="chartContainer">FusionCharts XT will load here</div> <script type="text/javascript"><!-- var json = [{ "response": { "version":"0.1", "termsofService":"http://www.wunderground.com/weather/api/d/terms.html", "features": { "conditions": 1 } } , "current_observation": { "image": { "url":"http://icons-ak.wxug.com/graphics/wu2/logo_130x80.png", "title":"Weather Underground", "link":"http://www.wunderground.com" }, "display_location": { "full":"Yorktown, VA", "city":"Yorktown", "state":"VA", "state_name":"Virginia", "country":"US", "country_iso3166":"US", "zip":"23690", "magic":"1", "wmo":"99999", "latitude":"37.22531891", "longitude":"-76.52363586", "elevation":"28.00000000" }, "observation_location": { "full":"York County, Virginia, Yorktown, Virginia", "city":"York County, Virginia, Yorktown", "state":"Virginia", "country":"US", "country_iso3166":"US", "latitude":"37.182751", "longitude":"-76.470512", "elevation":"8 ft" }, "estimated": { }, "station_id":"KVAYORKT2", "observation_time":"Last Updated on March 23, 5:51 PM EDT", "observation_time_rfc822":"Sun, 23 Mar 2014 17:51:27 -0400", "observation_epoch":"1395611487", "local_time_rfc822":"Sun, 23 Mar 2014 17:52:07 -0400", "local_epoch":"1395611527", "local_tz_short":"EDT", "local_tz_long":"America/New_York", "local_tz_offset":"-0400", "weather":"Light Rain", "temperature_string":"37.2 F (2.9 C)", "temp_f":37.2, "temp_c":2.9, "relative_humidity":"93%", "wind_string":"From the NNE at 3.0 MPH Gusting to 7.0 MPH", "wind_dir":"NNE", "wind_degrees":22, "wind_mph":3.0, "wind_gust_mph":"7.0", "wind_kph":4.8, "wind_gust_kph":"11.3", "pressure_mb":"1017", "pressure_in":"30.03", "pressure_trend":"0", "dewpoint_string":"35 F (2 C)", "dewpoint_f":35, "dewpoint_c":2, "heat_index_string":"NA", "heat_index_f":"NA", "heat_index_c":"NA", "windchill_string":"37 F (3 C)", "windchill_f":"37", "windchill_c":"3", "feelslike_string":"37 F (3 C)", "feelslike_f":"37", "feelslike_c":"3", "visibility_mi":"6.0", "visibility_km":"9.7", "solarradiation":"56", "UV":"0","precip_1hr_string":"-999.00 in ( 0 mm)", "precip_1hr_in":"-999.00", "precip_1hr_metric":" 0", "precip_today_string":"0.11 in (3 mm)", "precip_today_in":"0.11", "precip_today_metric":"3", "soil_temp_f": "0.0", "soil_moisture": "0.0", "leaf_wetness": "0.0", "icon":"rain", "icon_url":"http://icons-ak.wxug.com/i/c/k/rain.gif", "forecast_url":"http://www.wunderground.com/US/VA/Yorktown.html", "history_url":"http://www.wunderground.com/weatherstation/WXDailyHistory.asp?ID=KVAYORKT2", "ob_url":"http://www.wunderground.com/cgi-bin/findweather/getForecast?query=37.182751,-76.470512" } }]; FusionCharts.setCurrentRenderer('javascript'); var myChart = new FusionCharts("Charts/Column2D.swf", "myChartId", "400", "300", "0"); myChart.setXMLData("<chart caption='Temperature for my area' xAxisName='Temperature' yAxisName='In Celsius' >"+ "<set label='My Area' value='" +json[0].current_observation.temp_f+ "'/>" + "</chart>"); myChart.render("chartContainer"); // --> </script> </body> </html> Hope this helps! Share this post Link to post Share on other sites
Tumbleweed Report post Posted March 24, 2014 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> <script> jQuery(document).ready(function($) { $.ajax({ url : "http://api.wunderground.com/api/fee47ffeca88d616/geolookup/conditions/q/VA/Yorktown.json", dataType : "jsonp", success : function(parsed_json) { var temp_f = parsed_json['current_observation']['temp_f']; } }); }); </script> Thank you very much for the response. Is there a way I can use the above to gather the variable and insert it into the chart data instead of the entire xml? Thanks again, Rudy Share this post Link to post Share on other sites
Bindhu Report post Posted March 25, 2014 Hi, If you wish to update only the set element, then you have to use real time charts from the FusionWidgets XT package. For more details on 'Real-time capabilities', please refer to the link below, http://docs.fusioncharts.com/widgets/Contents/?RealTime/RealTimeOverview.html With FusionCharts XT, you will have to update the entire XML. Hope this helps! Share this post Link to post Share on other sites
Tumbleweed Report post Posted March 25, 2014 My desire was not to have real time but to grab the current temperature from the source at the time of page load. I really do not want to display updated/real time just the current condition. Is that possible? Rudy Share this post Link to post Share on other sites
Bindhu Report post Posted March 25, 2014 Hi, In that case you will have to update the entire chart XML data. Hope this helps! Share this post Link to post Share on other sites
Tumbleweed Report post Posted March 28, 2014 Thanks but I am not code smart enough to do that. Here is what I am trying to do. I would like to pull the "temp_f" value once not Real Time using the below code and use the pulled variable as the value in a chart, any standard chart. Is this possible? I can pull the temp_f data but I need to know what to do to format it so it can be then used as a variable value in a chart. I would really appreciate any help anyone could offer. Rudy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Weather Temperature</title></head><body><?php $json_string = file_get_contents("http://api.wunderground.com/api/fee47ffeca88d616/geolookup/conditions/q/VA/Yorktown.json");$parsed_json = json_decode($json_string);$location = $parsed_json->{'location'}->{'city'};$temp_f = $parsed_json->{'current_observation'}->{'temp_f'};echo "Current temperature in ${location} is: ${temp_f}\n"; ?></body></html> Share this post Link to post Share on other sites
Guest Sashibhusan Report post Posted April 1, 2014 Hi, First of all let me clarify myself that to render any single/multi series chart of FusionCharts Suite XT, you would need to provide the chart data either in XML or JSON format, as per the data format recommended by FusionCharts with respect to the chart type. So, if you are willing to provide the "temp_f" data to the chart, you would need to embed with in the XML/JSON string (as shown by Bindhu on 24 March 2014) and then provide to the chart JavaScript object instance. So, combining your and Bindhu's post on 24 March 2014, we would suggest you to get the "temp_f" value from jQuery ajax call and store in a JavaScript global variable (on success of the requested URL) and then embed that JavaScript variable value within the chart's XML/JSON data string. Hope this helps! Share this post Link to post Share on other sites
Tumbleweed Report post Posted April 9, 2014 Ok, with a little help I was able to get to this point: <html> <head> <title>My First chart using FusionCharts XT - using XML data embedded in the page</title> <script type="text/javascript" src="Charts/FusionCharts.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> <script> jQuery(document).ready(function($) { $.ajax({url : "http://api.wunderground.com/api/fee47ffeca88d616/geolookup/conditions/q/VA/Yorktown.json", dataType : "jsonp", success : function(parsed_json) { FusionCharts.setCurrentRenderer('javascript'); var myChart = new FusionCharts("Charts/Column3D.swf", "myChartId", "400", "300", "0"); myChart.setXMLData("<chart caption='Temperature for my area' xAxisName='Temperature' yAxisName='In Celsius' >"+ "<set label='" + parsed_json['location']['city'] + "' value='" + parsed_json['current_observation']['temp_f'] + "'/>" + "</chart>"); myChart.render("chartContainer"); } }); }); </script> </head> <body> <div id="chartContainer">FusionCharts XT will load here</div> </body> </html> I am unable to get this same code to work with FusionWidgets, a AngularGauge. Is there something I am missing? I would appreciate any help. Rudy Share this post Link to post Share on other sites
Guest Sashibhusan Report post Posted April 10, 2014 Hi, Please note that FusionCharts framework will take XML data as per the corresponding chart data format. So, the data format for "Column3D" chart can not be fit to the "AngularGauge". Hence, you would need to modify the XML string provided to "setXMLData()" as per the data format for AngularGauge. For more information, please refer: http://docs.fusioncharts.com/widgets/Contents/Angular/XMLAPI.html Also, to render the AngularGauge in JavaScript mode, you would require "FusionCharts.HC.Widgets.js" (from FusionWidgets XT pack) along with FusionCharts.js, FusionCharts.HC.js and jquery.min.js files. For more information, please refer: http://docs.fusioncharts.com/charts/contents/FirstChart/maps_charts.html Now, change the chart type to "AngularGauge.swf" in FusionCharts constructor and see if it resolves your issue. Hope this helps! Share this post Link to post Share on other sites
