কেন গুগল.ওললোডের ফলে আমার পৃষ্ঠাটি ফাঁকা হয়ে যায়?

103

আচ্ছা, এটি দেখতে অদ্ভুত লাগছে তবে আমি কোনও সমাধান খুঁজে পাচ্ছি না।

বিশ্বে কেন এই ঝাঁকুনি http://jsfiddle.net/carlesso/PKkFf/ পৃষ্ঠার সামগ্রীটি দেখায় এবং তারপরে যখন গুগল.লোড হয়, পৃষ্ঠাটি ফাঁকা হয়ে যায়?

গুগল.লোডটি তাত্ক্ষণিকভাবে সম্পন্ন করা হলে এটি ভালভাবে কাজ করে তবে বিলম্ব হওয়া কিছুতেই কাজ করে না।

আপনার অলস (বা স্মার্ট) জন্য পৃষ্ঠার উত্স এখানে:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Ciao</title>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
  </head>
  <body>
    <h1>Test</h1>
    <div id="quicivanno">
      <p>ciao</p>
    </div>
  </body>
  <script type="text/javascript">
       setTimeout(function() {google.load('visualization', '1.0', {'packages':['corechart']});}, 2000);
  </script>
</html>

javascript google-visualization google-loader

— এনরিকো কারলেসো
সূত্র

1

সুন্দর প্রশ্ন, এখানে একটি লিঙ্ক: বন্ধুত্ববিতু.কম

— জাজ

আমি লক্ষ্য করেছি, সেই ডকুমেন্ট. রাইট ('কিছু') পূর্ববর্তী এইচটিএমএলও সাফ করে দেবে, সম্ভবত ডকুমেন্টটি সেটটাইম আউটটির প্রেক্ষাপটে অসম্পূর্ণ?

— মাইন্ড্যান্ডমিডিয়া

109

দেখে মনে হচ্ছে গুগল.ল্ড ডকুমেন্ট.উরাইট () ব্যবহার করে পৃষ্ঠায় স্ক্রিপ্টটি যুক্ত করছে, যা পৃষ্ঠা লোড করার পরে ব্যবহৃত হলে, এইচটিএমএল মুছে দেয়।

এটি আরও গভীরতার সাথে ব্যাখ্যা করে: http://groups.google.com/group/google-ajax-search-api/browse_thread/thread/e07c2606498094e6

ধারণাগুলির একটি ব্যবহার করে, আপনি ডকটির চেয়ে অ্যাপেন্ড ব্যবহার করার জন্য চাপের জন্য লোডের জন্য একটি কলব্যাক ব্যবহার করতে পারেন।

setTimeout(function(){google.load('visualization', '1', {'callback':'alert("2 sec wait")', 'packages':['corechart']})}, 2000);

এটি বিলম্বিত সতর্কতা উইন্ডো সহ 2 সেকেন্ডের অপেক্ষাটি দেখায়

— তরঙ্গ
সূত্র

আমি চাই না যে সতর্কতা উইন্ডোটি প্রদর্শিত হোক তা করার জন্য কোনও কাজ আছে?

— শোয়েব মোহাম্মদ এ

4

সতর্কতা কোডের একটি উদাহরণ স্নিপেট ছিল। এটা কিছু হতে পারে।

— ওয়েভ

এটা অসাধারণ. আমি প্রত্যাশা হিসাবে যে কাজটিতে পরিবর্তিত হয়েছিল তা হ'ল সতর্কতা ফাংশনের পরিবর্তে ড্রচর্ট ফাংশনটি কল করা।

— চিওরক্স

খালি কলব্যাকের পরম যুক্ত করা আমার জন্য এটি স্থির করে।

— অ্যাডাম বি

32

আপনাকে কেবল একটি কলব্যাক সংজ্ঞায়িত করতে হবে, এবং এটি পৃষ্ঠাটি সাফ করবে না (সম্ভবত গুগল.ল্ড () এর পুরানো সংস্করণগুলি করেছে, তবে দৃশ্যত নতুনগুলি কলব্যাকের সাথে ব্যবহার না করলে তা নয়)। "Google.charts" lib লোড করার সময় এখানে সরল উদাহরণ রয়েছে:

if(google) {
    google.load('visualization', '1.0', {
        packages: ['corechart'],
        callback: function() {
            // do stuff, if you wan't - it doesn't matter, because the page isn't blank!
        }
    } )
}

হোয়াইটআউট কলব্যাক () করার সময় আমি এখনও ফাঁকা পৃষ্ঠাটি পাই get তবে কলব্যাকের সাহায্যে এটি আমার জন্য স্থির।

— Katai
সূত্র

5

দ্রষ্টব্য: একটি সময় বিলম্ব এড়ানোর জন্য নিম্নলিখিতটি ভাল - এটি ঠিক সময়ে। উদাহরণটি সাধারণত সমস্ত স্ক্রিপ্ট (এটি প্রয়োজন) দ্বারা ব্যবহার করা যেতে পারে তবে গ্রীসমনকি'র সাথে বিশেষত ব্যবহৃত হয়েছিল। এটি উদাহরণস্বরূপ গুগল চার্ট এপিআইও ব্যবহার করে তবে এই সমাধানটি অন্যান্য গুগল এপিআইগুলির বাইরে চলে যায় এবং কোনও স্ক্রিপ্ট লোড হওয়ার জন্য অপেক্ষা করতে আপনার যে কোনও জায়গায় ব্যবহার করা যেতে পারে।

কোনও গুগল চার্ট যুক্ত করতে গ্রীস্মোনকি ব্যবহার করার সময় কলব্যাকের সাহায্যে গুগল ডট লোড ব্যবহার করা সমস্যার সমাধান করেনি। প্রক্রিয়াতে (গ্রিজমোনকি পৃষ্ঠাতে ইনজেকশন করা), www.google.com/jsapi স্ক্রিপ্ট নোড যুক্ত করা হয়। গুগলের জাসাপি জাভাস্ক্রিপ্টের জন্য এই উপাদানটি যুক্ত করার পরে, ইনজেক্টেড (বা পৃষ্ঠা) স্ক্রিপ্টটি গুগল.লোড কমান্ড (যা যুক্ত নোডে লোড করা দরকার) ব্যবহার করতে প্রস্তুত, তবে এই জাসাপি স্ক্রিপ্টটি এখনও লোড হয়নি। সময়সীমা নির্ধারণের কাজটি করা হয়েছে, তবে সময়সীমাটি কেবল ইনজেকশিত / পৃষ্ঠা স্ক্রিপ্ট সহ গুগল জাসাপি স্ক্রিপ্ট লোডের সময়কালীন দৌড়ের জন্য একটি কর্মসীমা ছিল। যেখানে কোনও স্ক্রিপ্ট google.load (এবং সম্ভবত google.setOnLoadCallback) সম্পাদন করে সেখানে ঘোরাফেরা সময় দৌড় পরিস্থিতিকে প্রভাবিত করতে পারে। নীচে google.load কল করার আগে গুগল স্ক্রিপ্ট উপাদানটি লোড হওয়ার জন্য অপেক্ষা করে এমন একটি সমাধান নিখুঁত করেছে। এখানে একটি উদাহরণ:

// ********* INJECTED SCRIPT *********//
// add element
var gscript = document.createElement('script');
gscript.setAttribute("type", "application/javascript");
gscript.setAttribute("id", "XX-GMPlusGoogle-XX");
document.body.appendChild(gscript);

// event listener setup     
gscript.addEventListener("load",    
    function changeCB(params) {
        gscript.removeEventListener("load", changeCB);
        google.load("visualization", "1", {packages:["corechart"], "callback": 
            function drawChart() {
                var data;
                // set the durationChart data (not in example)
                data = new google.visualization.arrayToDataTable(durationChart);

                var options = {
                    title:"Chart Title",
                    legend: {position:"none"},
                    backgroundColor:"white",
                    colors:["white","Blue"],
                    width: window.innerWidth || document.body.clientWidth,
                    height: window.innerHeight || document.body.clientHeight,
                    vAxis: {title: "Durations", baselineColor: "black", textStyle:{fontSize:12}},
                    hAxis: {title: "Days Since First Instance"},
                    height: ((cnt > 5)? cnt * 50 : 300),
                    isStacked: true
                }; // options


                // put chart into your div element
                var chart = new google.visualization.BarChart(document.getElementById('XX-ChartDiv-XX'));
                chart.draw(data, options);
            } // drawChart function
        }); //packages within google.load & google load
    } // callback changeCB
);

// can use SSL as "https://www.google.com/jsapi";
gscript.src = "http://www.google.com/jsapi";

— codeaperature
সূত্র

2

আপনার সময়সীমা নির্ধারণ করার দরকার নেই। আর একটি উপায় আছে:

$.getScript("https://www.google.com/jsapi", function () {
     google.load('visualization', '1', { 'callback': 'alert()', 'packages': ['corechart'] });
});

ব্যাখ্যা:

 function () {
     google.load('visualization', '1', { 'callback': 'alert()', 'packages': ['corechart'] });
 }

সফল লোড জেএসপিআই স্ক্রিপ্টের পরে মৃত্যুদন্ড কার্যকর করা হবে, তারপরে সতর্কতা () সফল google.load () পরে কার্যকর করা হবে

— কামিল মিয়ারজিওস্কি
সূত্র

2

google.load(…)একটি jQuery $(document).ready(…)মোড়কের ভিতরে কোনও স্থানান্তরিত করার চেষ্টা করার সময় আমি এই সমস্যার মুখোমুখি হয়েছি । চলন্তgoogle.load(…) প্রস্তুত ফাংশন ফিরে বাহিরে তাই এটি অবিলম্বে সমস্যার সমাধান সঞ্চালন করে।

উদাহরণস্বরূপ, এটি কাজ করে না:

$(document).ready(function() {
    google.load('visualization', '1', {packages: ['corechart']});
});

তবে এটি করে:

google.load('visualization', '1', {packages: ['corechart']});
$(document).ready(function() {
    // …
});

— কুইন কমেন্ডেন্ট
সূত্র