ওপ্লেলেয়ার অ্যানিমেশন উদাহরণ এবং অ্যালগরিদম


57

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

আপনি কি ওপেনলেয়ারগুলির সাথে সামঞ্জস্যপূর্ণ অ্যানিমেশনটির জন্য কিছু ভাল ওয়েবসাইট বা অ্যালগরিদম জানেন?

এনিমেশন, কিছু কোড এবং উদাহরণ সম্পর্কে আমি এগুলি জানি। দয়া করে লোকেদের সাথে অ্যানিমেশন সম্পর্কে আপনার জ্ঞান ভাগ করুন যাদের এটি প্রয়োজন ...

সময় বিলম্ব সহ মানচিত্রে বৈশিষ্ট্য যুক্ত করার জন্য প্রাথমিক জাভাস্ক্রিপ্ট কোড ..

 time = 0;
    for (var i = 0; i < 5; i++) {
        time += 1000;
        setTimeout(function(j) {
            return function() {
                console.log("var is now", j);
            }
        }(i), time);
    }

i2maps

একটি জিওকোম্পুটিং পরিবেশ। এটি স্পিটিও-টেম্পোরাল ডেটা এবং ওয়েব-ওরিয়েন্টেড ভিজুয়ালাইজেশন থেকে জ্ঞান আবিষ্কারের জন্য নমনীয় প্রোগ্রামিং ফ্রেমওয়ার্ক সরবরাহ করে। জাভাস্ক্রিপ্ট লাইব্রেরি ইন্টারেক্টিভ ইউজার-ইন্টারফেস তৈরির জন্য ব্যবহৃত হয় এবং এটি ওপেনলায়ারসের শীর্ষে নির্মিত হয়।

i2map

ওপেনলায়ারস টাইমলাইন

ওপেনলায়ার্সের সাথে সময় সম্পর্কিত মানচিত্র তৈরি করার জন্য একটি সাধারণ গ্রন্থাগার। এটি ক্লাস্টার কৌশল (ওপেনলায়ার্স.স্ট্রেটজি.ক্লাস্টার) এবং সময় ফিল্টারিং সমর্থন করে। বর্তমানে এটি জিওজেএসন বা জিওআরএসএস ফর্ম্যাটে উত্স ডেটা সমর্থন করে।

timelien

Timemap.js

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

timemap

বাইক শেয়ার মানচিত্র

সরবরাহকারীর ওয়েবসাইট থেকে প্রতি 2-20 মিনিটে ডেটা স্বয়ংক্রিয়ভাবে আপডেট হয়। বাইকের ব্যবহার একযোগে ব্যবহার এবং এতে চক্র পুনরায় বিতরণ অন্তর্ভুক্ত। দিন জুড়ে আসল মোট ব্যবহার অনেক বেশি হতে পারে। বিতরণ ভারসাম্যহীনতা - সমস্ত স্ট্যান্ড একইরকম% পূর্ণ হওয়ার জন্য, যে চক্রের আলাদা স্ট্যান্ডে স্থানান্তরিত হওয়া দরকার need উচ্চতর নম্বরগুলি আরও ভারসাম্যহীন বিতরণ নির্দেশ করে, যেমন কেন্দ্রের অনেকগুলি বাইক, কিনারায় কয়েকটি। এই ওয়েবসাইটটি বাধার বিষয় হতে পারে।

ডেটা: সরবরাহকারীর ওয়েবসাইট। মানচিত্রের ডেটা: ওএস ওপেন ডেটা সহ ওপেনস্ট্রিটম্যাপ অবদানকারী। হোস্টিং: ইউসিএল। ম্যাপনিক এবং ওপেনলায়ার্স দ্বারা চালিত।

bikeshare

রাফালজেএস এবং ওপেনলায়ার্স ইন্টিগ্রেশন।

রাফায়েলজেএস একটি ছোট জাভাস্ক্রিপ্ট লাইব্রেরি যা ওয়েবে ভেক্টর গ্রাফিক্সের সাহায্যে আপনার কাজকে সহজসাধ্য করা উচিত। আপনি যদি নিজের নিজস্ব নির্দিষ্ট চার্ট বা চিত্র ক্রপ তৈরি করতে চান এবং উইজেটটি ঘোরান, উদাহরণস্বরূপ, আপনি সহজেই এবং সহজেই এই লাইব্রেরির মাধ্যমে এটি অর্জন করতে পারেন।

রাফায়েল

ওপেনলায়ার্স ফিল্টার কৌশল

এই উদাহরণটি একটি স্তরে পাস হওয়া বৈশিষ্ট্যগুলিকে সীমাবদ্ধ করতে ফিল্টার কৌশল ব্যবহার করে। এই স্তরের জন্য আবদ্ধ বৈশিষ্ট্যগুলির তারিখের মানগুলির সাথে একটি বৈশিষ্ট্য রয়েছে। একটি ফিল্টার কৌশল এমন ফিল্টারের মধ্যে নির্মিত যা দেখানো তারিখের পরিধি সীমাবদ্ধ করে। আপডেট হওয়া ফিল্টার সহ কৌশলটিতে সেট ফিল্টারকে কল করার সময়গুলির ডোমেনের মাধ্যমে একটি সাধারণ অ্যানিমেশন চক্র।

ছাঁকনি


1
RaphaëlJS এবং OpenLayers @Aragon লিঙ্কটি ভাগ
kinkajou

উত্তর:


6

জিওনোড একটি প্ল্যাটফর্ম যা জিওপ্যাটিয়াল ডেটা পরিচালনা ও প্রকাশের জন্য বিভিন্ন ওপেন সোর্স প্রকল্পগুলির (জ্যাঙ্গো, জিওএক্সটেক্স, ওপেনলায়ার্স, জিওওয়েব ক্যাচি, জিওসার্ভার, জিও নেটওয়ার্ক) একত্রিত করে।

উদাহরণস্বরূপ ম্যাপস্টোরি দ্বারা ব্যবহৃত যা historicতিহাসিক দৃষ্টিকোণ সহ অ্যানিমেটেড মানচিত্রের জন্য অবকাঠামো সরবরাহ করে:

এখানে চিত্র বর্ণনা লিখুন


2

0

আপনি যে উদাহরণগুলি দেখিয়েছেন সেটি অ্যারাগন সত্যিই দুর্দান্ত।

আমি কিছু অ্যানিমেশনের জন্য ওপেনলায়ার ব্যবহার করেছি, তবে মূল সমস্যাটি এটির জন্য কোনও "স্ট্যান্ডার্ড উপায়" নেই কারণ বৈশিষ্ট্যগুলির সাথে সময়কে মডেল করার কোনও মানক উপায় নেই।

রাস্টার ডেটার জন্য প্রতিটি কংক্রিট তাত্ক্ষণিক জন্য একটি স্তর তৈরি করা সহজ এবং প্রতিটি অ্যানিমেশন ধাপে কোন স্তরটি দৃশ্যমান হতে হবে তা পরিচালনা করা সহজ।

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

চিয়ার্স।


2
হুমমম, এটা কি উত্তর? মতামত মত আরও শোনাচ্ছে। আপনি যদি "সহজ" এবং "জটিল" উদাহরণ প্রকাশ করেন তবে এটি একটি উত্তর হয়ে উঠতে পারে।
টনি গিল
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.