ওপেনলায়ার্স 3 দর্শন কেন্দ্র পরিবর্তন করুন

Question

আমি কিছু মানচিত্রের সাথে ইন্টারঅ্যাক্ট করতে ওপেনলায়ার্স 3 ব্যবহার করছি। আমি প্রথম আমার মানচিত্রটি ঘোষণা করি:

map = new ol.Map({
            target: 'map',
            layers: [
              new ol.layer.Tile({
                  source: new ol.source.OSM()
              })
                ],
            view: new ol.View({
                center: [0, 0],
                zoom: 2
            })
        });

আমার ইভেন্টের কেন্দ্রটি পরিবর্তন করতে আমার এমন একটি ইভেন্ট আছে যা একটি ক্রিয়াকলাপ শুরু করে। এইভাবে, (আমার স্থানাঙ্কগুলি EPSG:4326ফর্ম্যাটে রয়েছে):

function CenterMap(lat, long) {
     console.log("Lat: " + lat + " Long: " + long);
     map.setView(new ol.View({
            center: ol.proj.transform([lat, long], 'EPSG:3857', 'EPSG:4326'),
            zoom: 5
     }));
}

যখন ফাংশনটি চালিত হয় আমি এক্সপ্লোরার কনসোলে এটি পাই:

Lat: 9.0412851667 Long: -79.5658145000 

কিন্তু মানচিত্রগুলি যায় [0,0], কেউ কেন জানেন কেন এটি ঘটে?

Answer 1

@.Proj.transfor এ আপনাকে ToProication এর আগে থেকে প্র্রোজেশন নির্দিষ্ট করতে হবে, তারপরে এটি কাজ করা উচিত।

মাইকেল জেন্ট্রি তার উত্তরে যেমন ব্যাখ্যা করেছেন, অন্য একটি সমস্যা হ'ল আপনাকে প্রথমে দ্রাঘিমাংশ (পশ্চিম-পূর্ব এভাবে x) এবং তারপরে অক্ষাংশ (দক্ষিণ-উত্তর এভাবে y) নির্দিষ্ট করতে হবে।

এবং কেন্দ্রটি নির্ধারণ করার আরও ভাল উপায় হ'ল সর্বদা একটি নতুন তৈরি করার পরিবর্তে বর্তমান দৃশ্যটি পাওয়া এবং সেখানে কেন্দ্র স্থাপন করা।

function CenterMap(long, lat) {
    console.log("Long: " + long + " Lat: " + lat);
    map.getView().setCenter(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));
    map.getView().setZoom(5);
}

Comments

ঠিক আছে আমি এটি ধন্যবাদ পেয়েছিলাম। আরও একটি জিনিস, আমি যদি সেভাবে এটি পরিবর্তন করি তবে আমি একটি নতুন ত্রুটি পাচ্ছি Uncaught TypeError: Failed to execute 'putImageData' on 'CanvasRenderingContext2D': float parameter 3 is non-finite. ol.js:457 2Uncaught RangeError: Invalid array length। এবং আমি মনে করি কারণ আমার স্থানাঙ্কগুলি দীর্ঘ। যদি আমি এটির জন্য [131.044922, -25.363882]এটি পরিবর্তন করি ঠিক আছে। তাহলে কি আমার স্থানাঙ্কগুলি অনেক দীর্ঘ ??

— গিলিলন

যে সমস্যা হওয়া উচিত নয়। কোন স্থানাঙ্ক নিয়ে ত্রুটি ঘটেছে? আপনি উপরে উল্লিখিত কি?

— সাইমন জাইক্স

হ্যাঁ ওখানে একটি

— গিলিলন

আমি একটি ম্যাপকিউস্ট মানচিত্রের সাথে এই সমন্বয়গুলি চেষ্টা করেছি এবং এটি কার্যকর হয়েছে। -79 এর দ্রাঘিমাংশ এখনও ইপিএসজি: 4326 (+/- 90 ডিগ্রির মধ্যে) এবং ইপিএসজি: 3857 (+/- 85 ডিগ্রির মধ্যে) সীমানার মধ্যে রয়েছে।

— সাইমন জাইক্স

এটি রেন্ডারারের ভিতরে এবং এটি একটি রেঞ্জারারের মধ্যে একটি টাইপর রয়েছে

— সাইমন জাইক্স

Answer 2

আমার কাছে একটি নতুন স্ট্যাক এক্সচেঞ্জ অ্যাকাউন্ট রয়েছে এবং "আনচাট টাইপ এয়ারার: ​​'ক্যানভাস রেন্ডারিং কনটেক্সট 2 ডি' তে 'পুটইমেজডেটা' চালানোতে ব্যর্থ: ফ্লোট প্যারামিটার 3 সীমাবদ্ধ নয়।" ত্রুটি. এটি ঘটে কারণ আপনার ল্যাট এবং দীর্ঘ ইনপুটগুলি পিছনের দিকে রয়েছে।

map.getView().setCenter(ol.proj.transform([lat, long], 'EPSG:4326', 'EPSG:3857'));

হতে হবে:

map.getView().setCenter(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));

অন্য কারও ক্ষেত্রে যদি এই সমস্যা থাকে।

Comments

হ্যাঁ আপনি ঠিক বলেছেন - আমি সেই অনুযায়ী আমার উত্তর আপডেট করব।

— সাইমন জাইক্স

Answer 3

কেবল ব্রাউজার ব্যবহারের জন্য:

<script src='https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js'></script>


  ol.proj.transform() 

  ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857');

জেএস-অ্যাপ ব্যবহারের জন্য

   // for projection
  import {transform} from 'ol/proj.js';

  // use this one : transform([-118.246521, 34.049039], 'EPSG:4326', 'EPSG:3857')





   var map = new Map({
    layers: layers,
    target: 'map',
    view: new View({
      //center: [-118.246521, 34.049039],
        center: transform([-118.246521, 34.049039], 'EPSG:4326', 'EPSG:3857'),
      zoom: 16
    })
  });