মানচিত্র জাভাস্ক্রিপ্ট API-এর জন্য স্টাইল রেফারেন্স

প্ল্যাটফর্ম নির্বাচন করুন: অ্যান্ড্রয়েড আইওএস জাভাস্ক্রিপ্ট

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

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

আরও ব্যাপক স্টাইলিং অভিজ্ঞতার জন্য, আপনি এর পরিবর্তে ক্লাউড-ভিত্তিক ম্যাপ স্টাইলিং-এর সাথে JSON স্টাইলিং ব্যবহার করতে পারেন, যা ম্যাপের আরও বিস্তৃত বৈশিষ্ট্য এবং অধিক কাস্টমাইজেশন বিকল্প প্রদান করে। ক্লাউড-ভিত্তিক ম্যাপ স্টাইলিং JSON স্কিমাটি এমবেডেড JSON স্টাইল ডিক্লারেশনের সাথে ব্যাকওয়ার্ড কম্প্যাটিবল নয়। এর মানে হলো, ক্লাউড-ভিত্তিক ম্যাপ স্টাইলিং JSON সরাসরি Maps JavaScript API-তে ব্যবহার করা যাবে না। তবে, আপনি ক্লাউড-ভিত্তিক ম্যাপ স্টাইলিং JSON স্কিমাতে এমবেডেড JSON স্টাইল ডিক্লারেশন ইম্পোর্ট করতে পারবেন।

উদাহরণ

নিম্নলিখিত JSON স্টাইল ডিক্লারেশনটি ম্যাপের সমস্ত ফিচারকে ধূসর রঙে পরিণত করে, তারপর প্রধান সড়কের জ্যামিতিকে নীল রঙে রাঙিয়ে দেয় এবং ল্যান্ডস্কেপ লেবেলগুলিকে সম্পূর্ণরূপে লুকিয়ে ফেলে:

[
  {
    "featureType": "all",
    "stylers": [
      { "color": "#C0C0C0" }
    ]
  },{
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      { "color": "#CCFFFF" }
    ]
  },{
    "featureType": "landscape",
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
  }
]

JSON অবজেক্ট

একটি JSON স্টাইল ডিক্লারেশন নিম্নলিখিত উপাদানগুলো নিয়ে গঠিত:

• featureType (ঐচ্ছিক) - এই স্টাইল পরিবর্তনের জন্য যে ফিচারগুলো নির্বাচন করতে হবে। ফিচার হলো মানচিত্রের ভৌগোলিক বৈশিষ্ট্য, যার মধ্যে রাস্তা, পার্ক, জলাশয় এবং আরও অনেক কিছু অন্তর্ভুক্ত। আপনি যদি কোনো ফিচার নির্দিষ্ট না করেন, তাহলে সমস্ত ফিচারই নির্বাচিত হবে।
• এলিমেন্টটাইপ (ঐচ্ছিক) - নির্দিষ্ট ফিচারের যে প্রপার্টিটি নির্বাচন করতে হবে। এলিমেন্ট হলো একটি ফিচারের উপাংশ, যার মধ্যে লেবেল এবং জ্যামিতি অন্তর্ভুক্ত। আপনি যদি কোনো এলিমেন্ট নির্দিষ্ট না করেন, তাহলে ফিচারটির সমস্ত এলিমেন্ট নির্বাচিত হবে।
• স্টাইলার - নির্বাচিত ফিচার এবং এলিমেন্টগুলিতে প্রয়োগ করার নিয়মাবলী। স্টাইলার কোনো ফিচারের রঙ, দৃশ্যমানতা এবং গুরুত্ব নির্ধারণ করে। আপনি একটি ফিচারে এক বা একাধিক স্টাইলার প্রয়োগ করতে পারেন।

একটি স্টাইল নির্দিষ্ট করতে, আপনাকে এক সেট featureType ও elementType সিলেক্টর এবং আপনার stylers একত্রিত করে একটি স্টাইল অ্যারে তৈরি করতে হবে। আপনি একটিমাত্র অ্যারের মধ্যে যেকোনো ফিচারের সমন্বয়কে টার্গেট করতে পারেন। তবে, একবারে প্রয়োগ করা স্টাইলের সংখ্যা সীমিত। যদি আপনার স্টাইল অ্যারের অক্ষর সংখ্যা সর্বোচ্চ সীমা অতিক্রম করে, তাহলে কোনো স্টাইল প্রয়োগ করা হবে না।

এই পৃষ্ঠার বাকি অংশে বৈশিষ্ট্য, উপাদান এবং স্টাইলার সম্পর্কে আরও তথ্য রয়েছে।

featureType

নিম্নলিখিত JSON কোডটি ম্যাপের সমস্ত রাস্তা নির্বাচন করে:

{
  "featureType": "road"
}

বৈশিষ্ট্য বা বৈশিষ্ট্যের প্রকারভেদ হলো মানচিত্রের ভৌগোলিক বৈশিষ্ট্য, যার মধ্যে রাস্তা, পার্ক, জলাশয়, ব্যবসা প্রতিষ্ঠান এবং আরও অনেক কিছু অন্তর্ভুক্ত।

ফিচারগুলো একটি ক্যাটাগরি ট্রি গঠন করে, যার রুট হলো all ’। আপনি যদি কোনো ফিচার নির্দিষ্ট না করেন, তাহলে সব ফিচারই নির্বাচিত হয়ে যায়। all ’ ফিচারটি নির্দিষ্ট করলেও একই ফল পাওয়া যায়।

কিছু ফিচারের মধ্যে চাইল্ড ফিচার থাকে, যা আপনি ডট নোটেশন ব্যবহার করে নির্দিষ্ট করেন। উদাহরণস্বরূপ, landscape.natural বা road.local । যদি আপনি শুধু প্যারেন্ট ফিচারটি, যেমন road , নির্দিষ্ট করেন, তাহলে প্যারেন্টের জন্য নির্দিষ্ট করা স্টাইলগুলো এর সমস্ত চাইল্ডের উপর প্রযোজ্য হবে, যেমন road.local এবং road.highway ।

মনে রাখবেন যে, প্যারেন্ট ফিচারগুলোতে এমন কিছু উপাদান অন্তর্ভুক্ত থাকতে পারে যা তাদের সব চাইল্ড ফিচারে অন্তর্ভুক্ত নয়।

নিম্নলিখিত বৈশিষ্ট্যগুলি উপলব্ধ আছে:

• all (ডিফল্ট) সমস্ত বৈশিষ্ট্য নির্বাচন করে।
• administrative সমস্ত প্রশাসনিক এলাকা নির্বাচন করে। স্টাইলিং শুধুমাত্র প্রশাসনিক এলাকার লেবেলগুলিকে প্রভাবিত করে, এর ভৌগোলিক সীমানা বা ফিলকে নয়।
  • administrative.country দেশগুলো নির্বাচন করে।
  • administrative.land_parcel ভূমি খণ্ড নির্বাচন করে।
  • administrative.locality এলাকাসমূহ নির্বাচন করে।
  • administrative.neighborhood এলাকা নির্বাচন করে।
  • administrative.province প্রদেশসমূহ নির্বাচন করে।
• landscape সকল ল্যান্ডস্কেপ নির্বাচন করে।
  • landscape.man_made ভবন ও অন্যান্য কাঠামোর মতো মানবসৃষ্ট বৈশিষ্ট্য নির্বাচন করে।
  • landscape.natural পর্বত, নদী, মরুভূমি এবং হিমবাহের মতো প্রাকৃতিক বৈশিষ্ট্য নির্বাচন করে।
  • landscape.natural.landcover ভূমির আচ্ছাদন বৈশিষ্ট্য, অর্থাৎ ভূপৃষ্ঠকে আবৃতকারী ভৌত উপাদান, যেমন—বন, তৃণভূমি, জলাভূমি এবং অনাবৃত ভূমি নির্বাচন করে।
  • landscape.natural.terrain কোনো ভূমিপৃষ্ঠের ভূ-বৈশিষ্ট্য, যেমন উচ্চতা, ঢাল এবং অভিমুখ নির্বাচন করে।
• poi আগ্রহের সমস্ত স্থান নির্বাচন করে।
  • poi.attraction পর্যটন আকর্ষণগুলো নির্বাচন করে।
  • poi.business ব্যবসা প্রতিষ্ঠানগুলোকে নির্বাচন করে।
  • poi.government সরকারি ভবন নির্বাচন করে।
  • poi.medical হাসপাতাল, ফার্মেসি, পুলিশ, ডাক্তার এবং অন্যান্যসহ জরুরি পরিষেবাগুলো নির্বাচন করে।
  • poi.park পার্কগুলো নির্বাচন করে।
  • poi.place_of_worship গির্জা, মন্দির, মসজিদ ও অন্যান্য উপাসনালয় নির্বাচন করে।
  • poi.school স্কুল নির্বাচন করে।
  • poi.sports_complex ক্রীড়া কমপ্লেক্সগুলো নির্বাচন করে।
• road সকল রাস্তা নির্বাচন করে।
  • road.arterial প্রধান সড়কগুলো নির্বাচন করে।
  • road.highway হাইওয়ে নির্বাচন করে।
  • road.highway.controlled_access নিয়ন্ত্রিত প্রবেশাধিকারযুক্ত মহাসড়কগুলো নির্বাচন করে।
  • road.local স্থানীয় রাস্তাগুলো নির্বাচন করে।
• transit সমস্ত ট্রানজিট স্টেশন ও লাইন নির্বাচন করে।
  • transit.line ট্রানজিট লাইন নির্বাচন করে।
  • transit.station সমস্ত ট্রানজিট স্টেশন নির্বাচন করে।
  • transit.station.airport বিমানবন্দর নির্বাচন করে।
  • transit.station.bus বাস স্টপ নির্বাচন করে।
  • transit.station.rail রেল স্টেশন নির্বাচন করে।
• water জলাশয় নির্বাচন করে।

elementType

নিম্নলিখিত JSON কোডটি সমস্ত স্থানীয় রাস্তার জন্য লেবেল নির্বাচন করে:

{
  "featureType": "road.local",
  "elementType": "labels"
}

উপাদান হলো কোনো বৈশিষ্ট্যের উপবিভাগ। উদাহরণস্বরূপ, একটি রাস্তা মানচিত্রের গ্রাফিক্যাল রেখা (জ্যামিতি) এবং এর নাম নির্দেশকারী লেখা (লেবেল) নিয়ে গঠিত।

নিম্নলিখিত উপাদানগুলো উপলব্ধ আছে, তবে মনে রাখবেন যে একটি নির্দিষ্ট ফিচার এই উপাদানগুলোর কোনোটিই, কয়েকটি বা সবগুলোই সমর্থন করতে পারে:

জুম লেভেলের উপর ভিত্তি করে লেবেল টেক্সটের fill এবং stroke রঙ পরিবর্তিত হয়। বিভিন্ন জুম লেভেলে অভিজ্ঞতাটি সামঞ্জস্যপূর্ণ রাখতে, সর্বদা fill এবং stroke উভয়ই নির্ধারণ করুন।

• all (ডিফল্ট) নির্দিষ্ট ফিচারের সমস্ত উপাদান নির্বাচন করে।
• geometry নির্দিষ্ট ফিচারটির সমস্ত জ্যামিতিক উপাদান নির্বাচন করে।
  • geometry.fill ফিচারটির জ্যামিতির শুধুমাত্র ফিল অংশটি নির্বাচন করে।
  • geometry.stroke ফিচারটির জ্যামিতির শুধুমাত্র স্ট্রোকটি নির্বাচন করে।
• labels নির্দিষ্ট ফিচারটির সাথে সংশ্লিষ্ট পাঠ্য লেবেলগুলো নির্বাচন করে।
  • labels.icon শুধুমাত্র ফিচারটির লেবেলের মধ্যে প্রদর্শিত আইকনটি নির্বাচন করে।
  • labels.text শুধুমাত্র লেবেলের লেখাটি নির্বাচন করে।
  • labels.text.fill শুধুমাত্র লেবেলের ফিল নির্বাচন করে। লেবেলের ফিল সাধারণত একটি রঙিন আউটলাইন হিসেবে রেন্ডার করা হয় যা লেবেলের টেক্সটকে ঘিরে থাকে।
  • labels.text.stroke শুধুমাত্র লেবেলের টেক্সটের স্ট্রোক নির্বাচন করে।

stylers

স্টাইলার হলো ফরম্যাটিং অপশন যা আপনি ম্যাপের ফিচার এবং এলিমেন্টগুলোতে প্রয়োগ করতে পারেন।

নিম্নলিখিত JSON স্নিপেটটি একটি RGB মান ব্যবহার করে একটি বৈশিষ্ট্যকে উজ্জ্বল সবুজ হিসাবে প্রদর্শন করে:

"stylers": [
  { "color": "#99FF33" }
]

এই কোড স্নিপেটটি কোনো ফিচারের প্রাথমিক রঙ নির্বিশেষে, তার রঙ থেকে সমস্ত তীব্রতা মুছে দেয়। এর ফলে ফিচারটি গ্রেস্কেলে রেন্ডার হয়।

"stylers": [
  { "saturation": -100 }
]

এই কোড অংশটি একটি ফিচার সম্পূর্ণরূপে লুকিয়ে ফেলে:

    "stylers": [
      { "visibility": "off" }
    ]

নিম্নলিখিত স্টাইল বিকল্পগুলি সমর্থিত:

• hue ( #RRGGBB ফরম্যাটের একটি RGB হেক্স স্ট্রিং) মৌলিক রঙকে নির্দেশ করে।

  দ্রষ্টব্য: এই অপশনটি ডিফল্ট গুগল স্টাইলে (অথবা ম্যাপে আপনার সংজ্ঞায়িত অন্যান্য স্টাইল অপশনে) নির্দিষ্ট করা স্যাচুরেশন এবং লাইটনেস অপরিবর্তিত রেখে হিউ (hue) সেট করে। এর ফলে প্রাপ্ত রঙটি বেস ম্যাপের স্টাইলের সাপেক্ষে নির্ধারিত হয়। গুগল যদি বেস ম্যাপের স্টাইলে কোনো পরিবর্তন আনে, তবে সেই পরিবর্তনগুলো আপনার ম্যাপের hue দিয়ে স্টাইল করা ফিচারগুলোকেও প্রভাবিত করবে। সম্ভব হলে অ্যাবসোলিউট color স্টাইলার ব্যবহার করাই শ্রেয়।

• lightness ( -100 থেকে 100 এর মধ্যে একটি ফ্লোটিং পয়েন্ট মান) উপাদানটির উজ্জ্বলতার শতাংশ পরিবর্তন নির্দেশ করে। ঋণাত্মক মান অন্ধকার বাড়ায় (যেখানে -১০০ কালো নির্দেশ করে) এবং ধনাত্মক মান উজ্জ্বলতা বাড়ায় (যেখানে +১০০ সাদা নির্দেশ করে)।

  দ্রষ্টব্য: এই অপশনটি ডিফল্ট গুগল স্টাইলে (অথবা ম্যাপে আপনার সংজ্ঞায়িত অন্যান্য স্টাইল অপশনে) নির্দিষ্ট করা স্যাচুরেশন এবং হিউ অপরিবর্তিত রেখে লাইটনেস সেট করে। এর ফলে প্রাপ্ত রঙটি বেস ম্যাপের স্টাইলের সাপেক্ষে নির্ধারিত হয়। গুগল যদি বেস ম্যাপের স্টাইলে কোনো পরিবর্তন আনে, তবে সেই পরিবর্তনগুলো আপনার ম্যাপের lightness দিয়ে স্টাইল করা ফিচারগুলোকেও প্রভাবিত করবে। সম্ভব হলে অ্যাবসোলিউট color স্টাইলার ব্যবহার করাই শ্রেয়।

• saturation ( -100 থেকে 100 মধ্যে একটি ফ্লোটিং পয়েন্ট মান) এলিমেন্টটিতে প্রয়োগ করার জন্য মূল রঙের তীব্রতার শতাংশ পরিবর্তন নির্দেশ করে।

  দ্রষ্টব্য: এই অপশনটি ডিফল্ট গুগল স্টাইলে (অথবা ম্যাপে আপনার সংজ্ঞায়িত অন্যান্য স্টাইল অপশনে) নির্দিষ্ট করা হিউ এবং লাইটনেস অপরিবর্তিত রেখে স্যাচুরেশন সেট করে। এর ফলে প্রাপ্ত রঙটি বেস ম্যাপের স্টাইলের সাপেক্ষে নির্ধারিত হয়। গুগল যদি বেস ম্যাপের স্টাইলে কোনো পরিবর্তন আনে, তবে সেই পরিবর্তনগুলো আপনার ম্যাপের saturation দিয়ে স্টাইল করা ফিচারগুলোকেও প্রভাবিত করবে। সম্ভব হলে অ্যাবসোলিউট color স্টাইলার ব্যবহার করাই শ্রেয়।

• gamma ( 0.01 থেকে 10.0 এর মধ্যে একটি ফ্লোটিং পয়েন্ট মান, যেখানে 1.0 কোনো সংশোধন প্রয়োগ করে না) নির্দেশ করে যে এলিমেন্টটিতে কী পরিমাণ গামা সংশোধন প্রয়োগ করতে হবে। গামা সংশোধন সাদা বা কালো মানকে প্রভাবিত না করে, রঙের উজ্জ্বলতাকে একটি নন-লিনিয়ার পদ্ধতিতে পরিবর্তন করে। গামা সংশোধন সাধারণত একাধিক এলিমেন্টের কনট্রাস্ট পরিবর্তন করতে ব্যবহৃত হয়। উদাহরণস্বরূপ, আপনি এলিমেন্টের প্রান্ত এবং ভেতরের অংশের মধ্যে কনট্রাস্ট বাড়াতে বা কমাতে গামা পরিবর্তন করতে পারেন।

  দ্রষ্টব্য: এই অপশনটি একটি গামা কার্ভ ব্যবহার করে ডিফল্ট গুগল স্টাইলের সাপেক্ষে উজ্জ্বলতা সামঞ্জস্য করে। গুগল যদি বেস ম্যাপ স্টাইলে কোনো পরিবর্তন আনে, তবে সেই পরিবর্তনগুলো আপনার ম্যাপের gamma দিয়ে স্টাইল করা ফিচারগুলোকেও প্রভাবিত করবে। সম্ভব হলে অ্যাবসোলিউট color স্টাইলার ব্যবহার করাই শ্রেয়।

• invert_lightness (যদি true ) বিদ্যমান উজ্জ্বলতাকে উল্টে দেয়। উদাহরণস্বরূপ, সাদা লেখা সহ একটি গাঢ় মানচিত্রে দ্রুত পরিবর্তন করার জন্য এটি উপযোগী।

  দ্রষ্টব্য: এই অপশনটি কেবল ডিফল্ট গুগল স্টাইলকে উল্টে দেয়। গুগল যদি বেস ম্যাপ স্টাইলে কোনো পরিবর্তন করে, তবে সেই পরিবর্তনগুলো আপনার ম্যাপের invert_lightness দিয়ে স্টাইল করা ফিচারগুলোকেও প্রভাবিত করবে। সম্ভব হলে অ্যাবসোলিউট color স্টাইলার ব্যবহার করাই শ্রেয়।

• visibility ( on , off বা simplified ) নির্দেশ করে যে এলিমেন্টটি ম্যাপে প্রদর্শিত হবে কি না এবং কীভাবে হবে। একটি simplified ভিজিবিলিটি প্রভাবিত ফিচারগুলো থেকে কিছু স্টাইল ফিচার সরিয়ে দেয়; উদাহরণস্বরূপ, রাস্তাগুলো আউটলাইন ছাড়া পাতলা লাইনে সরলীকৃত হয়, অন্যদিকে পার্কগুলো তাদের লেবেল টেক্সট হারায় কিন্তু লেবেল আইকনটি ধরে রাখে।
• color (যা #RRGGBB ফরম্যাটের একটি RGB হেক্স স্ট্রিং) ফিচারটির রঙ নির্ধারণ করে।
• weight (একটি পূর্ণসংখ্যা, যা শূন্যের সমান বা তার চেয়ে বড়) ফিচারটির ওজন পিক্সেলে নির্ধারণ করে। weight-এর মান বেশি নির্ধারণ করলে টাইল বর্ডারের কাছাকাছি ক্লিপিং হতে পারে।

স্টাইল নিয়মগুলো আপনার নির্দিষ্ট করা ক্রমেই প্রয়োগ করা হয়। একাধিক অপারেশনকে একটিমাত্র স্টাইল অপারেশনে একত্রিত করবেন না। এর পরিবর্তে, স্টাইল অ্যারেতে প্রতিটি অপারেশনকে একটি পৃথক এন্ট্রি হিসাবে সংজ্ঞায়িত করুন।

দ্রষ্টব্য: ক্রম গুরুত্বপূর্ণ, কারণ কিছু অপারেশন বিনিময়যোগ্য নয়। স্টাইল অপারেশনের মাধ্যমে যে ফিচার এবং/অথবা এলিমেন্টগুলো পরিবর্তন করা হয়, সেগুলোর (সাধারণত) আগে থেকেই স্টাইল থাকে। অপারেশনগুলো সেই বিদ্যমান স্টাইলগুলোর উপর কাজ করে, যদি সেগুলো উপস্থিত থাকে।

হিউ, স্যাচুরেশন, লাইটনেস মডেল

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

স্টাইলার অপারেশনের মধ্যে রঙ বোঝাতে স্টাইলড ম্যাপগুলো হিউ, স্যাচুরেশন, লাইটনেস (HSL) মডেল ব্যবহার করে। হিউ মূল রঙকে, স্যাচুরেশন সেই রঙের তীব্রতাকে এবং লাইটনেস উপাদান রঙে সাদা বা কালোর আপেক্ষিক পরিমাণকে নির্দেশ করে।

গামা কারেকশন কালার স্পেস জুড়ে উজ্জ্বলতাকে পরিবর্তন করে, সাধারণত কনট্রাস্ট বাড়াতে বা কমাতে। এছাড়াও, HSL মডেল একটি কোঅর্ডিনেট স্পেসের মধ্যে রঙকে সংজ্ঞায়িত করে, যেখানে hue একটি কালার হুইলের মধ্যে অভিমুখ নির্দেশ করে, এবং স্যাচুরেশন ও লাইটনেস বিভিন্ন অক্ষ বরাবর বিস্তার নির্দেশ করে। হিউ-কে একটি RGB কালার স্পেসের মধ্যে পরিমাপ করা হয়, যা বেশিরভাগ RGB কালার স্পেসের মতোই, তবে এতে সাদা এবং কালোর শেডগুলো অনুপস্থিত।

যদিও hue একটি HTML হেক্স কালার ভ্যালু গ্রহণ করে, এটি শুধুমাত্র মৌলিক রঙ নির্ধারণ করতে এই ভ্যালুটি ব্যবহার করে — অর্থাৎ, কালার হুইলে এর অবস্থান; এর স্যাচুরেশন বা লাইটনেস নয়, যা আলাদাভাবে শতাংশ পরিবর্তন হিসাবে নির্দেশিত হয়।

উদাহরণস্বরূপ, আপনি বিশুদ্ধ সবুজের হিউ hue:0x00ff00 অথবা hue:0x000100 হিসেবে নির্ধারণ করতে পারেন। উভয় হিউ ​​অভিন্ন। HSL কালার মডেলে উভয় মানই বিশুদ্ধ সবুজকে নির্দেশ করে।

একটি আরজিবি রঙের চাকা

RGB hue ভ্যালু, যা লাল, সবুজ এবং নীলের সমান অংশ নিয়ে গঠিত, তা কোনো হিউ নির্দেশ করে না, কারণ এই ভ্যালুগুলোর কোনোটিই HSL কোঅর্ডিনেট স্পেসে কোনো ওরিয়েন্টেশন নির্দেশ করে না। উদাহরণস্বরূপ, "#000000" (কালো), "#FFFFFF" (সাদা), এবং ধূসরের সমস্ত বিশুদ্ধ শেড। কালো, সাদা বা ধূসর নির্দেশ করতে হলে, আপনাকে অবশ্যই সমস্ত saturation সরিয়ে ফেলতে হবে (ভ্যালু -100 এ সেট করে) এবং এর পরিবর্তে lightness অ্যাডজাস্ট করতে হবে।

এছাড়াও, আগে থেকেই কালার স্কিম থাকা কোনো ফিচার পরিবর্তন করার সময়, hue মতো কোনো মান পরিবর্তন করলে তার বিদ্যমান saturation বা lightness পরিবর্তিত হয় না।