মানচিত্র অ্যাপ্লিকেশনটির আরম্ভ করার জন্য রিফ্রেশ দরকার

9

আমি স্ট্যাকওভারফ্লোতে এই প্রশ্নটি চেষ্টা করেছিলাম কিন্তু কোনও উত্তর পাইনি। আশা করি আপনারা সবাই সাহায্য করতে সক্ষম হবেন।

জাভাস্ক্রিপ্ট / দোজোতে একটি ওয়েব ম্যাপিং অ্যাপ্লিকেশন তৈরি করা:

আমি যখন ব্রাউজারে অ্যাপটি লোড করি তখন এটি এইচটিএমএল উপাদানগুলি লোড করে তবে প্রক্রিয়া বন্ধ করে দেয়। বাকী পৃষ্ঠা এবং জাভাস্ক্রিপ্ট লোড করার জন্য ব্রাউজারটি তা রিফ্রেশ করতে হবে।

আমি সারা দিন টেস্টিং এবং ডিবাগিং করেছি এবং বুঝতে পেরেছিলাম আমার বাহ্যিক জেএস ফাইলগুলি ভুল জায়গায় রয়েছে (আমি একটি ছদ্মবেশী)। এটি স্থির হয়েছে এবং অ্যাপটি দুর্দান্তভাবে লোড করেছে ... আমার ফাইলগুলির একটিও সঠিকভাবে পড়ছে না বা মোটেও নয়।

আমি যখন প্রশ্নটিতে বহিরাগত জেএস ফাইলের বিষয়বস্তুগুলিকে ডিফল্টর মূল কোডে স্থানান্তরিত করি, তখন তাদের যে কার্যকারিতা থাকে তা ঠিকঠাক কাজ করুন ... তবে মানচিত্রে আবার রিফ্রেশ দরকার।

তুলবেন। বাহ্যিক জেএস ফাইলের নীচে কোডটি যা আমার সমস্যা সৃষ্টি করছে। এটি কেন সমস্যা তা আমি বুঝতে পারি না কারণ বাহ্যিক না হলে ফাংশনগুলি প্রত্যাশা অনুযায়ী কাজ করে।

কোন সাহায্য ব্যাপকভাবে প্রশংসা করা হয়।

//Toggles
function basemapToggle() {
            basemaptoggler = new dojo.fx.Toggler({
                node: "basemaptoggle",
                showFunc : dojo.fx.wipeIn,
                showDuration: 1000,
                hideDuration: 1000,
                hideFunc : dojo.fx.wipeOut
            })
        }
        dojo.addOnLoad(basemapToggle);

        function layerToggle() {
            layertoggler = new dojo.fx.Toggler({
                node: "layertoggle",
                showFunc : dojo.fx.wipeIn,
                showDuration: 750,
                hideDuration: 750,
                hideFunc : dojo.fx.wipeOut
            })
        }
        dojo.addOnLoad(layerToggle);

        function legendToggle() {
            legendtoggler = new dojo.fx.Toggler({
                node: "legendtoggle",
                showFunc : dojo.fx.wipeIn,
                hideFunc : dojo.fx.wipeOut
            })
        }
        dojo.addOnLoad(legendToggle);

আমার কোডের সামনের অংশটি এখানে

<!DOCTYPE HTML> 
  <html>  
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=8, IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title> 
        Zoning Classifications
    </title> 
        <link rel="Stylesheet" href="ZoningClassifications.css" />
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.0/js/dojo/dijit/themes/claro/claro.css">
        <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.0/js/esri/dijit/css/Popup.css">
        <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.0/js/dojo/dojox/grid/resources/Grid.css">
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.0/js/dojo/dojox/grid/resources/claroGrid.css">
    <style type="text/css"> 
    </style> 

        <script src="JS/layers.js"></script>
        <script src="JS/search.js"></script>
        <script src="JS/basemapgallery.js"></script>

        <script src="JS/identify.js"></script>
        <script src="JS/toggles.js"></script>
        <script type="text/javascript"> 
      var djConfig = {
        parseOnLoad: true
      };
    </script> 
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.0"></script>
    <script type="text/javascript"> 

            dojo.require("dijit.dijit"); // optimize: load dijit layer
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
      dojo.require("dijit.TitlePane");
      dojo.require("esri.dijit.BasemapGallery");
      dojo.require("esri.arcgis.utils");
            dojo.require("esri.tasks.locator");
            dojo.require("esri.dijit.Legend");
            dojo.require("esri.dijit.Popup");
            dojo.require("dijit.form.Button");
            dojo.require("dojo.fx");
            dojo.require("dijit.Dialog");
            dojo.require("dojo.ready");
      dojo.require("dijit.TooltipDialog");
            dojo.require("dojox.grid.DataGrid");
      dojo.require("dojo.data.ItemFileReadStore");
      dojo.require("esri.tasks.find");

সম্পাদনা 2 আমি মূল ডিফল্ট html ফাইলে সমস্ত কোড (সিএসএস বাদে) রেখে অ্যাপটিকে সম্পূর্ণ নতুন করে লিখেছি। আমি কীভাবে এটি কাজ করতে পারি তা নিশ্চিত করার জন্য আমি টুকরো টুকরো পরীক্ষা করেছি tested টগলস কোড যুক্ত করা হ'ল একমাত্র কোড যা এটিকে ছুঁড়ে দেয় এবং অতিরিক্ত রিফ্রেশের কারণ হয়।

তাই আপাতত আমি ড্রপ ডাউন উপাদানগুলি (বেসম্যাপ গ্যালারী, স্তরগুলি, কিংবদন্তি) ধরে রাখতে ডিজিটাল.টাইটেলপ্যান ব্যবহার করছি। তবে এর সাহায্যে আপনি চেহারা পরিবর্তন করতে পারবেন না এবং তাদের চিত্রগুলি বানাতে বোধ করবেন এটি আমার শেষ লক্ষ্য।

যে কেউ বিকল্প প্রস্তাব দিতে পারে তাই আমি 3 টি আলাদা চিত্র ব্যবহার করতে পারি যাতে আপনি যখন ছবিটিতে ক্লিক করেন এবং ড্রপ ডাউন মেনুটি বেসম্যাপ গ্যালারী, স্তর তালিকা এবং কিংবদন্তি ধারণ করে?

arcgis-server  arcgis-javascript-api 
— ক্রেইগ
সূত্র
আমি এখানে একটি হেড / বডি ট্যাগ দেখতে পাচ্ছি না, আপনার সমস্ত জাভাস্ক্রিপ্ট কোড হেডারে লোড হয়েছে কিনা?
— গ্লেন প্লাস
দুঃখিত। ঠিক কর. পোস্টটি শুরু করার পরে কোনওভাবে এটি ফর্ম্যাট হয়ে গেল।
— ক্রেগ
— Mapperz
চেষ্টা করে দেখলাম, কিন্তু কিছুই হয়নি। আমি প্রায় নিশ্চিত যে সমস্যাটি আমার dojo.fx.Toggler ফাংশন নিয়ে। আমার অন্যান্য সমস্ত বাহ্যিক জেএস ফাইলগুলি পুরোপুরি কাজ করে। আমি কেন কষ্ট পাচ্ছি তা নিশ্চিত নয়। ইএসআরআইয়ের সাথে যোগাযোগ করা হয়েছে এবং তারা এটি সন্ধান করছে, তাই আশা করি খুব শীঘ্রই আমার একটি সমাধান হবে।
— ক্রেগ
বাহ্যিক ফাইলগুলি আসলে লোড হচ্ছে তা দেখার জন্য আপনি কি Chrome বিকাশকারী সরঞ্জামের মতো কিছু ব্যবহার করার চেষ্টা করেছেন? এটি কমপক্ষে আপনাকে জানাতে পারে যে ফাইলগুলি লোড করার ক্ষেত্রে আপনার পৃষ্ঠাটি কতদূর চলেছে এবং যেখানে কোনও ত্রুটি রয়েছে।
— pecoanddeco

উত্তর:

7

আমি সেই সমস্ত dojo.addOnLoad () কলগুলি একত্রীকরণ করব। আমার সন্দেহ হয় কোনও ফাংশন ডাকার আগে কিছু লোড হচ্ছে না।

আপনার সমস্ত বাহ্যিক জাভাস্ক্রিপ্ট ফাইল থেকে সমস্ত dojo.addOnLoad কলগুলি স্ট্রিপ করুন এবং সেগুলি আপনার মূল এইচটিএমএল ফাইলের একটি কলটিতে বান্ডিল করুন। আপনি আপনার জাভাস্ক্রিপ্টের নীচে একটি নতুন ফাংশনে লোডে আগুন জ্বালাতে চান এমন সমস্ত ফাংশন রাখুন:

function init() {
  basemapToggle();
  layerToggle();
  whatEver();
}
dojo.addOnLoad(init);

এটি নিশ্চিত করবে যে কোনও ফাংশন বন্ধ করার চেষ্টা করার আগে সবকিছু লোড হয়ে গেছে।

— Mintx
সূত্র
5

আপনি যদি এই গভীরভাবে ফিনকন্ট্রোল / পরীক্ষা করতে চান, তবে কোনও ফ্রেমওয়ার্ক (jquery / dojo) এর বাইরে এটি শুরু করতে হবে outside আপনি এই ছোট লাইব্রেরি চেষ্টা করতে পারেন:

var stack = [],
    interval,
    loaded; // has window.onload fired?

function doPoll() {
  var notFound = [];
  for (var i=0; i<stack.length; i++) {
    if (document.getElementById(stack[i].id)) {
      stack[i].callback();
    } else {
      notFound.push(stack[i]);
    }
  }
  stack = notFound;
  if (notFound.length < 1 || loaded) {
    stopPolling();
  }
}

function startPolling() {
  if (interval) {return;}
  interval = setInterval(doPoll, 10);
}

function stopPolling() {
  if (!interval) {return;}
  clearInterval(interval);
  interval = null;
}

function onAvailable(id, callback) {
  stack.push({id:id, callback:callback});
  startPolling();
}

window.onload = function() {
  loaded = true;
  doPoll();
};

এবং তারপরে এটি ব্যবহার করুন:

onAvailable('map', function () {
    // Only do stuff here once the map div is available (this always happens after the DOM is ready)
  ....
});

মূলত আপনি যা করেন তা বলে: এই ডিভের অস্তিত্ব না পাওয়া পর্যন্ত স্টাফ করার জন্য অপেক্ষা করুন। এটি ডকুমেন্টের চেয়ে আলাদা আচরণ করে ready সুতরাং আপনার জন্য, আপনি কোডটি dojo.*এখানে রাখবেন।

আপনি কিছু জাভাস্ক্রিপ্ট কোডের লোড ক্রম দিয়ে কামড়ায় কি না তা দেখার জন্য এটি দুর্দান্ত পরীক্ষা। আমি এটি দিচ্ছি কারণ এই ধরণের সমস্যাগুলি বাছাই করতে (সমস্যা সমাধান) এর ভাল ব্যবহার হয়েছে।

— গ্লেন প্লাস
সূত্র
আমি কোনও পরামর্শ ছাড়াই আপনার কোডটি আমার কোডে যুক্ত করার চেষ্টা করেছি। এটি আমার বিদ্যমান জগাখিচুড়ি মধ্যে কোথায় যাওয়া উচিত তা আরও ব্যাখ্যা করতে সহায়তা করতে পারেন?
— ক্রেগ
একটি পৃথক জেএস ফাইলের শীর্ষস্থানীয় ব্লকটি রাখুন, এটি শিরোনামে অন্তর্ভুক্ত করুন, তারপরে আপনার ডোম উপাদানগুলির জন্য পরীক্ষা করুন যা আপনার কোডে কাজ করে: onAvailable('basemapToggle', function () { dojo.addOnLoad(basemapToggle); });এটি সরাসরি সমাধান নয় তবে এটি আপনাকে আপনার লোড অর্ডার সমস্যা বুঝতে সহায়তা করবে
— গ্লেন প্লস
3

দেখে মনে হচ্ছে আপনার কোনও স্ক্রিপ্ট অর্ডার সমস্যা রয়েছে। আপনার টগলস.জেএস ডোজো লোড হওয়ার উপর নির্ভর করে। তবে, আপনার এইচটিএমএলে, আপনি ইএসআরআই এর জাভাস্ক্রিপ্ট এপিআই লোড করার আগে toggles.js কল করছেন যা ডোজো লোড করে। আপনি কীভাবে আপনার স্ক্রিপ্টগুলি পুনর্গঠন করতে পারেন সে সম্পর্কে এখানে একটি পরামর্শ।

...
<style type="text/css"></style> 

    <script type="text/javascript"> 
       var djConfig = { parseOnLoad: true };
    </script> 
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.0"></script>
    <script type="text/javascript"> 

        dojo.require("dijit.dijit"); // optimize: load dijit layer
        dojo.require("dijit.layout.BorderContainer");
        dojo.require("dijit.layout.ContentPane");
        dojo.require("esri.map");
        dojo.require("dijit.TitlePane");
        dojo.require("esri.dijit.BasemapGallery");
        dojo.require("esri.arcgis.utils");
        dojo.require("esri.tasks.locator");
        dojo.require("esri.dijit.Legend");
        dojo.require("esri.dijit.Popup");
        dojo.require("dijit.form.Button");
        dojo.require("dojo.fx");
        dojo.require("dijit.Dialog");
        dojo.require("dojo.ready");
        dojo.require("dijit.TooltipDialog");
        dojo.require("dojox.grid.DataGrid");
        dojo.require("dojo.data.ItemFileReadStore");
        dojo.require("esri.tasks.find");
    </script>
    <script src="JS/layers.js"></script>
    <script src="JS/search.js"></script>
    <script src="JS/basemapgallery.js"></script>

    <script src="JS/identify.js"></script>
    <script src="JS/toggles.js"></script>
    ...
— raykendo
সূত্র
আমি স্ক্রিপ্টগুলি পুনরায় অর্ডার করার চেষ্টা করেছি। আমি যখন এপিআই স্ক্রিপ্টের পরে বাহ্যিক স্ক্রিপ্টগুলি রাখি তখন কেবলমাত্র এইচটিএমএল লোডগুলি (শিরোনাম, লোগো, সাবহেডার)। আমি তখন জাভাস্ক্রিপ্ট লোড করতে রিফ্রেশ করতে হবে।
— ক্রেগ
আমি আমার শেষ উত্তরটি সম্পাদনা করেছি। আপনার বাহ্যিক ফাইলগুলির আগে dojo.requires স্ক্রিপ্টটি রাখার চেষ্টা করুন। এছাড়াও, আপনি এইচটিএমএল শরীরের নীচে আপনার বাহ্যিক স্ক্রিপ্টগুলি স্থানান্তরিত করতে বিবেচনা করতে পারেন, যাতে এই স্ক্রিপ্টগুলি চালানোর আগে সমস্ত ডিওএম উপাদান লোড হয়েছে।
— রায়কেণ্ডো
আপনার সম্পাদিত বিকল্পগুলির উভয়ই একই ত্রুটির ফলস্বরূপ, জেএস লোড করতে রিফ্রেশ করার প্রয়োজন।
— ক্রেগ
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.