লিফলেট সহ মানচিত্রের বাহিরে নিয়ন্ত্রণ স্থাপন করা?

Question

লিফলেট দিয়ে আমি কীভাবে মানচিত্রের সামগ্রীর বাইরে নিয়ন্ত্রণ রাখতে পারি তা আমাকে কেউ বলতে পারেন?

এই ক্ষেত্রে, আমি কেবল মানচিত্রের অবজেক্টের বাইরে লেয়ার সুইচ নিয়ন্ত্রণ রাখতে চাই।

Answer 1

লিফলেটটি মানচিত্রের পোর্টালটি বাস্তবায়ন গোপন করার জন্য অনেকগুলি হাত-avingেউ করে but

getContainerফাংশন শুধু আপনার কি প্রয়োজন। এটি কেবল মার্কআপ নয়, আসল এইচটিএমএল নোডটি দেয়।

এটি তখন নোড আন-চাইল্ডিং (?) এর মতোই সহজ এবং জাভাস্ক্রিপ্টের কয়েকটি লাইন সহ একটি নতুন পিতামাতার কাছে এটি অর্পণ করে।

কাজের উদাহরণ এবং মন্তব্যগুলি (এবং একটি কিক-গাধা টাইলসেট)!

http://codepen.io/romahicks/pen/ONmPmp

কোড

//Create Layer
var baseMap = new    L.TileLayer('http://{s}.tiles.mapbox.com/v3/gvenech.m13knc8e/{z}/{x}/{y}.png'   );

var baseMapIndex = {
  "Map": baseMap
};

// Create the map
var map = new L.map('map', {
  center: new L.LatLng(41.019829, 28.989864),
  zoom: 14,
  maxZoom: 18,
  zoomControl: false, // Disable the default zoom controls.
  layers: baseMap
});

// Create the control and add it to the map;
var control = L.control.layers(baseMapIndex);
control.addTo(map);

 // Call the getContainer routine.
 var htmlObject = control.getContainer();
 // Get the desired parent node.
 var a = document.getElementById('new-parent');

 // Finally append that node to the new parent, recursively searching out and re-parenting nodes.
 function setParent(el, newParent)
 {
    newParent.appendChild(el);
 }
 setParent(htmlObject, a);

আপনার অবশ্যই অবশ্যই সমস্ত বাচ্চাদের মধ্য দিয়ে যেতে হবে এবং তাদের তাদের পিতামাতার কাছে পুনরায় অর্পণ করতে হবে। একটি সাধারণ পুনরাবৃত্ত লুপের জন্য দ্বিতীয় উত্তরটি দেখুন।

/programming/20910147/how-to-move-all-html-element-children-to-another-parent-using-javascript

Comments

চমৎকার কাজ. ইতিমধ্যে আপনাকে ভোট দিয়েছে, তবে আপনার উত্তরটিতে প্রাসঙ্গিক জাভাস্ক্রিপ্ট যুক্ত করতে আপনি কি আপত্তি করবেন?

— elrobis

a.appendChild(control.onAdd(map))যথেষ্ট হতে হবে। আরও দেখুন stackoverflow.com/questions/36041651/...

— ghybs

এটি getContainer সমাধানের সাথে ভাল কাজ করেছে। কিন্তু যখন আমি a.appendChild (control.onAdd (মানচিত্র)) দিয়ে চেষ্টা করেছি তখন সমস্ত wms স্তর এবং স্তর নিয়ন্ত্রণ অদৃশ্য হয়ে যায়।

— মরিসিও সান্টোস

আমি বাচ্চাদের পেতে পুনরাবৃত্ত লুপ দিয়ে আমার উত্তর আপডেট করি, দুঃখিত। যদি এটি কাজ না করে তবে আমাকে জানান।

— রোমাএইচ

@ মরিসিওস্যান্টোস আমার খারাপ, এটি কেবল হিসাবে কাজ করে না L.control.layers।

— গায়েবস

Answer 2

সহজ ব্যবহারের উপায় আমি ব্যবহার করেছি:

এইচটিএমএল ট্যাগের নীচে যুক্ত করুন, যেখানে আপনি লিফলেট নিয়ন্ত্রণগুলি সরিয়ে নিতে চান:

<div id="custom-map-controls"></div>

জাভাস্ক্রিপ্ট কোড:

$(document).ready(function () {

var newParent = document.getElementById('custom-map-controls');
        var oldParent = document.getElementsByClassName("leaflet-top leaflet-right")

        while (oldParent[0].childNodes.length > 0) {
            newParent.appendChild(oldParent[0].childNodes[0]);
        }
 });