javascript - Google Chart won't always load up on page load -


as title says, loads fine, doesn't show @ all. (applies browsers)

when loads: http://puu.sh/hpkrh/03adef7313.png

when doesn't: http://puu.sh/hpkjt/097c9e3e67.png

this code loaded page after closing body tag before closing html tag.

    var rankedsolo5 = {           gamesplayed: 0,           wins: 0,           losses: 0,           winpercent: 0,           assists: 0,           kills: 0,           minkills: 0,           neutralminkills: 0,           turretskilled: 0,           averagekills: 0,};   $.ajax({     url: 'https://'+summonerregion+'.api.pvp.net/api/lol/'+summonerregion+'/v1.4/summoner/by-name/'+summonername+'?api_key=76555fa3-4e44-4b11-8692-f2cfad2fd30d',     datatype: 'json',      //if summoner doesn't exist show error      error : function(jqxhr, textstatus, errorthrown) {          if(jqxhr.status == 404 || errorthrown == 'not found'){              $(".statsvalue").html(summonererror);}},      //if summoner found, find id of summoner           success: function(response) {         nametoid = response;         console.log(nametoid);         console.log(nametoid[summonername].name);         $('#summonerprofilename').html(nametoid[summonername].name);         summonerid = nametoid[summonername].id;         $.ajax({         url: 'https://'+summonerregion+'.api.pvp.net/api/lol/'+summonerregion+'/v1.3/stats/by-summoner/'+summonerid+'/summary?season=season2015&api_key=76555fa3-4e44-4b11-8692-f2cfad2fd30d',         datatype: 'json',      //when id found, retrieve stats      success: function(response) {     if (summonername != undefined){         jsondata = response;         console.log(jsondata);           //ranked solo 5v5 stats           rankedsolo5["wins"] = jsondata.playerstatsummaries[5].wins;          rankedsolo5["losses"] = jsondata.playerstatsummaries[5].losses;          rankedsolo5["assists"] = jsondata.playerstatsummaries[5].aggregatedstats.totalassists;         $("#rankedassistssolo5 .statsvalue").html(rankedsolo5["assists"]);          rankedsolo5["kills"] = jsondata.playerstatsummaries[5].aggregatedstats.totalchampionkills;         $("#rankedkillssolo5 .statsvalue").html(rankedsolo5["kills"]);          rankedsolo5["minkills"] = jsondata.playerstatsummaries[5].aggregatedstats.totalminionkills;         $("#rankedminkillssolo5 .statsvalue").html(rankedsolo5["minkills"]);          rankedsolo5["neutralminkills"] = jsondata.playerstatsummaries[5].aggregatedstats.totalneutralminionskilled;         $("#rankedneutralminkillssolo5 .statsvalue").html(rankedsolo5["neutralminkills"]);          rankedsolo5["turretskilled"] = jsondata.playerstatsummaries[5].aggregatedstats.totalturretskilled;         $("#rankedturretskilledsolo5 .statsvalue").html(rankedsolo5["turretskilled"]);              //ratios, etc...                 rankedsolo5["gamesplayed"] = rankedsolo5["wins"]+rankedsolo5["losses"];                 $("#rankedgamesplayedsolo5 .statsvalue").html(rankedsolo5["gamesplayed"]);                  rankedsolo5["winpercent"] = math.floor(rankedsolo5["wins"]*(100/(rankedsolo5["wins"]+rankedsolo5["losses"])))+"%";                 $("#rankedwinpercentsolo5").html(rankedsolo5["winpercent"]);           //draw charts after data collected             chart();          }                }         });     } });}  google.load("visualization", "1", {packages:["corechart"]});   google.setonloadcallback(drawchart);   function drawchart() {      var data = new google.visualization.datatable();     data.addcolumn('string', 'stats');     data.addcolumn('number', 'stats');     data.addrows([       ['wins', rankedsolo5["wins"]],       ['losses', rankedsolo5["losses"]],     ]);      var data2 = google.visualization.arraytodatatable([       ['m/t ratio', 'minion kills/turret kills'],       ['minion kills', rankedteam5["minkills"]],       ['turret kills', rankedteam5["turretskilled"]]     ]);      var options = {       width: 200,       height: 200,       colors: ['#337ab7', '#ff5e5e', '#ec8f6e', '#f3b49f', '#f6c7b6'],       piehole: 0.4,       backgroundcolor: {fill: 'none'},       pieslicebordercolor:"transparent",       legend: 'none',       chartarea: {'width': '85%', 'height': '85%'},       pieslicetext: 'label',       fontsize: 11,      };        settimeout(function(){         var chart = new google.visualization.piechart(document.getelementbyid('donutchart'));             chart.draw(data, options);         var chart2 = new google.visualization.piechart(document.getelementbyid('donutchart2'));             chart2.draw(data2, options);         var chart3 = new google.visualization.piechart(document.getelementbyid('donutchart3'));             chart3.draw(data2, options);         var chart4 = new google.visualization.piechart(document.getelementbyid('donutchart4'));             chart4.draw(data2, options);     },250);   }    google.load("visualization", "1", {packages:["corechart"]});   google.setonloadcallback(drawchart);   function drawchart() {      var data = new google.visualization.datatable();     data.addcolumn('string', 'stats');     data.addcolumn('number', 'stats');     data.addrows([       ['wins', rankedsolo5["wins"]],       ['losses', rankedsolo5["losses"]],     ]);      var data2 = google.visualization.arraytodatatable([       ['m/t ratio', 'minion kills/turret kills'],       ['minion kills', rankedteam5["minkills"]],       ['turret kills', rankedteam5["turretskilled"]]     ]);      var options = {       width: 200,       height: 200,       colors: ['#337ab7', '#ff5e5e', '#ec8f6e', '#f3b49f', '#f6c7b6'],       piehole: 0.4,       backgroundcolor: {fill: 'none'},       pieslicebordercolor:"transparent",       legend: 'none',       chartarea: {'width': '85%', 'height': '85%'},       pieslicetext: 'label',       fontsize: 11,      };        settimeout(function(){         var chart = new google.visualization.piechart(document.getelementbyid('donutchart'));             chart.draw(data, options);         var chart2 = new google.visualization.piechart(document.getelementbyid('donutchart2'));             chart2.draw(data2, options);         var chart3 = new google.visualization.piechart(document.getelementbyid('donutchart3'));             chart3.draw(data2, options);         var chart4 = new google.visualization.piechart(document.getelementbyid('donutchart4'));             chart4.draw(data2, options);     },250);   }

my head tag looks this:

    <head>     <meta http-equiv="content-type" content="text/html; charset=utf-8" />     <script type="text/javascript" src="https://www.google.com/jsapi"></script>     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">     <link rel="stylesheet" type="text/css" href="css/style.css">     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>     <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css">     <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>  </head>

any figuring out appreciated.

for reason google chart won't consistently render if don't set width , height on actual dom container (i.e. it's not enough rely on width , height settings in options)


Comments

Post a Comment

Popular posts from this blog

shopping cart - Page redirect not working PHP -

im trying redirect user when click "empty cart". redirect working "add cart" not "empty cart". ideas great. in main .php file set current url seen $current_url = base64_encode("http://$_server[http_host]$_server[request_uri]"); then below cartaction.php file handles actions such "add cart" , "empty cart" <?php session_start(); include_once 'config.php'; //add item in shopping cart if(isset($_post["add"])) { $product_id = $_post["product_id"]; //product id $return_url = base64_decode($_post["return_url"]); //return url $qty = $_post["qty"]; $product = $mysqli->query("select product_name, unit_price, unit_quantity products product_id = '$product_id'"); $obj = $product->fetch_object(); if(!isset($_session['products'])) { $_session['products'] = array(); } if(array_key_exists($product_id...
Read more

php - How to modify a menu to show sub-menus -

i have custom php menu made person, displays categories menu. however, need display subcategories well. tried adding hierarchical parameter didn't work. hoping assistance! here code: <ul> <?php /* categories wp e-commerce products */ $wpec_product_categories = get_terms( 'wpsc_product_category', 'hide_empty=0&parent=0&exclude=298'); $myarray = array(); foreach($wpec_product_categories $wpec_categories){ $myarray[$wpec_categories->term_id]['name'] = $wpec_categories->name; $myarray[$wpec_categories->term_id]['slug'] = $wpec_categories->slug; $myarray[$wpec_categories->term_id]['term_id'] = $wpec_categories->term_id; } foreach($myarray $wpec_categories1){ $wpec_term_name = $wpec_categories1['name']; $wpec_term_slug = $wpec_categories1['slug']; $wpec_term_id = $wpec_categories1['term_id']; echo '<li> <a href="'.get_page_link(19)....
Read more

python - Installing PyDev in eclipse is failed -

unable read repository @ http://pydev.sf.net/updates/content.xml. sun.security.validator.validatorexception: pkix path building failed: sun.security.provider.certpath.suncertpathbuilderexception: unable find valid certification path requested target i installing pydev in eclipse using python, doesn't install successfully. gives above error. happened? how solve error? i had error when trying install on laptop behind corporate firewall. couldn't tell setup of firewall, not sure of root cause. i got passed error installing pydev eclipse when out behind firewall. another way got around have eclipse on non-firewalled machine, install pydev eclipse, , copy whole eclipse directory non-firewalled machine firewalled machine. there better way, , way fix properly, didn't have time work out firewall doing. this on windows 7 machine (yeah know) not work *nix versions installed through package manager yum or apt.
Read more