آیکون های پویا

مهم: در حالی که نمودارهای پویا و تعاملی Google به طور فعال حفظ می شوند، ما رسماً نمودارهای تصویر ثابت Google را در سال 2012 منسوخ کردیم . در 18 مارس 2019 خاموش شد.

این صفحه نحوه ایجاد انواع پیام‌ها، حباب‌ها، پین‌ها و سایر گرافیک‌ها را توضیح می‌دهد که می‌توان با استفاده از URL ایجاد کرد.

Same dynamic icon marker as standalone image.
https://chart.googleapis.com/chart?chst=d_bubble_icon_text_small&chld=ski|bb|Wheeee!|FFFFFF|000000

  1. معرفی
  2. نحو
  3. انواع آیکون
  4. حباب ها
  5. پین ها
  6. یادداشت های سبک سرگرم کننده
  7. یادداشت های پیش بینی آب و هوا
  8. بلوک های متن فونت مشخص شده (فقط متن)
  9. بلوک های متن فونت مشخص شده (متن + نماد)
  10. لیست پرچم ها و نمادهای موجود
  11. رشته های متنی
  12. سایه ها

معرفی

می‌توانید پیام‌ها، پین‌ها یا حباب‌های جالبی ایجاد کنید که متن و تصاویر را با هم ترکیب می‌کنند. به این موارد آیکون های پویا می گویند.

Large bubble with text only.Same dynamic icon marker as standalone image.

نحو

URL ریشه: https://chart.googleapis.com/chart?

نمادهای پویا از پارامترهای زیر پس از ? در آدرس ریشه:

پارامتر الزامی یا اختیاری شرح
chst=< icon_string_constant > ضروری

توضیح می دهد که چه نوع نمادی ایجاد شود.

  • icon_string_constant - یک رشته ثابت که نوع آیکون مورد نظر را توصیف می کند. برای انتخاب نماد به انتخاب نمادهای زیر مراجعه کنید.
chld=< icon_data > ضروری

داده های خاصی که برای توصیف اندازه، چرخش، متن و سایر داده های مورد نیاز نماد استفاده می شود.

  • icon_data - مجموعه ای از مقادیر محدود شده با لوله متناسب با نماد. اسناد موجود در این صفحه توصیف می‌کنند که چه مقادیری برای هر نوع نماد مورد نیاز است.

انواع آیکون

تایپ کنید مثال ها
حباب ها - حباب های متنی کوچک یا بزرگ را با یا بدون آیکون انتخاب کنید. Small bubble with icon and text.
Medium bubble with icon and one line of text.
Large bubble with text only
Large bubble with text only.
پین ها - انواع پین ها می توانند ساده، ستاره دار یا مایل باشند و می توانند دارای نماد، یک حرف یا رشته های متنی طولانی تر باشند. Plain pin with letterPlain pin with icon
یادداشت های سبک سرگرم کننده با متن و عنوان اختیاری
یادداشت های پیش بینی آب و هوا با عنوان، متن و نماد آب و هوا
بلوک متنی چند خطی، بدون نماد Outlined text
تک خط مشخص شده بلوک متنی با نماد

بازگشت به بالا

حباب ها

حباب ها در ترکیب های مختلفی از ویژگی ها وجود دارند: اندازه بزرگ یا کوچک، با یا بدون نماد، متن تک خطی یا چند خطی. جدول زیر انواع حباب ها و نحو هر کدام را توضیح می دهد. شرح هر مقدار پارامتر در زیر جدول توضیح داده شده است.

چند نکته اضافی:

  • اندازه همه حباب ها متناسب با عرض و ارتفاع متنی که وارد می کنید تغییر می کند.
  • ثابت حباب از تغییری پشتیبانی می کند که به _withshadow ختم می شود. اگر از تغییر _withshadow استفاده می کنید، یک سایه به زیر حباب شما اضافه می کند.
متن آیکون نحو فقط سایه مثال
تک خط خیر chst=
d_bubble_text_small[ _withshadow ]

chld=
< frame_style >|
< text >|
< fill_color >|
< text_color >
chst=
[ d_ ]bubble_text_small_shadow

chld=
< frame_style >|
< text >

chst=d_bubble_text_small
chld=
bb|
Launch+site|
C6EF8C|
000000
تک خط آره chst=
d_bubble_icon_text_small[ _withshadow ]

chld=
< icon_string >|
< frame_style >|
< text >|
< fill_color >|
< text_color >
chst=
[ d_ ]bubble_icon_text_small_shadow

chld=
< icon_string >|
< frame_style >|
< text >

chst=d_bubble_icon_text_small
chld=
wc|
bb|
Pay+Toilets|
C6EF8C|
000000
تک خط آره chst=
d_bubble_icon_text_big[ _withshadow ]

chld=
< icon_string >|
< frame_style >|
< text >|
< fill_color >|
< text_color >
chst=
[ d_ ]bubble_icon_text_big_shadow

chld=
< icon_string >|
< frame_style >|
< text >

chst=d_bubble_icon_text_big
chld=
snack|
bb|
$2.99+!|
FFBB00|
000000
چند خطی خیر chst=
d_bubble_texts_big[ _withshadow ]

chld=
< frame_style >|
< fill_color >|
< text_color >|
< text_line_1 >
|...|
< text_line_n >
chst=
[ d_ ]bubble_texts_big_shadow

chld=
< frame_style >|
< text_line_1 >
|...|
< text_line_n >

chst=d_bubble_texts_big
chld=
bb|
FFB573|
000000|
Help+Wanted|
Hours:+Midnight+to+3:00+AM|
Good+pay,+interesting+work|
Contact+V.+Helsing
چند خطی آره

chst=d_bubble_icon_texts_big[ _withshadow ]

chld=
< icon_string >|
< frame_style >|
< fill_color >|
< text_color >|
< text_line_1 >
|...|
< text_line_n >

chst=
[ d_ ]bubble_icon_texts_big_shadow
chld=
< icon_string >|
< frame_style >|
< text_line_1 >
|...|
< text_line_n >

chst=d_bubble_icon_texts_big
chld=
home|
bb|
FFB573|
000000|
Haunted+House|
Hours:+Midnight+to+3:00+AM|
Ghouls,+Goblins,+and+Vampires|
Bring+your+own+wooden+stake

نحو

< icon_string >
رشته ای که یکی از نمادهای توضیح داده شده در انتهای این سند را مشخص می کند.
< frame_style >
جهت دم. یکی از ثابت های جهت دم زیر را انتخاب کنید:
  • bb - قاب بادکنک، دم در پایین سمت چپ Balloon frame, tail at bottom left

  • bbtl - قاب بالون، دم در بالا سمت چپ Balloon frame, tail at top left

  • bbtr - قاب بالون، دم در بالا سمت راست Balloon frame, tail at top right

  • bbbr - قاب بادکنک، دم در پایین سمت راست Balloon frame, tail at bottom right

  • bbT - قاب بادکنکی، بدون دم Balloon frame, no tail

  • edge_bl - قاب لبه، دم در لبه پایین، انتهای سمت چپ Edge frame, tail at bottom edge, left end

  • edge_bc - قاب لبه، دم در لبه پایین، وسط Edge frame, tail at bottom edge, centered

  • edge_br - قاب لبه، دم در لبه پایین، انتهای سمت راست Edge frame, tail at bottom edge, right end

  • edge_tl - قاب لبه، دم در لبه بالا، انتهای سمت چپ Edge frame, tail at top edge, left end

  • edge_tc - قاب لبه، دم در لبه بالا، در مرکز Edge frame, tail at top edge, centered

  • edge_tr - قاب لبه، دم در لبه بالا، انتهای سمت راست Edge frame, tail at top edge, right end

  • edge_lt - قاب لبه، دم در لبه چپ، انتهای بالا Edge frame, tail at left edge, top end

  • edge_lc - قاب لبه، دم در لبه چپ، وسط Edge frame, tail at left edge, centered

  • edge_lb - قاب لبه، دم در لبه چپ، انتهای پایین Edge frame, tail at left edge, bottom end

  • edge_rt - قاب لبه، دم در لبه سمت راست، انتهای بالا Edge frame, tail at right edge, top end

  • edge_rc - قاب لبه، دم در لبه راست، وسط Edge frame, tail at right edge, centered

  • edge_rb - قاب لبه، دم در لبه سمت راست، انتهای پایین Edge frame, tail at right edge, bottom end
< fill_color >
رنگ پر حباب، به عنوان یک رنگ شش رقمی HTML هگزادسیمال.
< text_color >
رنگ متن، به عنوان یک رنگ شش رقمی HTML هگزادسیمال.
< متن >
یک خط متن حبابی برای حباب های یک خطی. فاصله ها باید علامت + باشند.
< text_line_1 >|...|< text_line_n >
یک یا چند خط متن، برای حباب های متنی چند خطی. هر خط با یک | از هم جدا می شود علامت گذاری. خط اول بزرگتر و پررنگ نشان داده می شود. فاصله ها باید با + جایگزین شوند.

فقط سایه

برای حباب ها، می توانید با استفاده از نحو نشان داده شده در جدول بالا، سایه مستقل را نیز بکشید. مثال ها:

Shadow for a d_bubble_text_small marker
chst=
d_bubble_text_small_shadow
chld=
bb|Launch+site
Shadow for a d_bubble_icon_text_small marker
chst=
d_bubble_icon_text_small_shadow
chld=
wc|bb|Pay+Toilets
Shadow for a d_bubble_icon_text_big marker
chst=
d_bubble_icon_text_big_shadow
chld=
snack|bb|$2.99+!
Shadow for a d_bubble_texts_big marker
chst=
d_bubble_texts_big_shadow
chld=
bb|Help+Wanted|
Hours:+Midnight+to+3:00+AM|
Good+pay,+interesting+work|
Contact+V.+Helsing
Shadow for a d_bubble_icon_texts_big marker
chst=
d_bubble_icon_texts_big_shadow
chld=
home|bb|Haunted+House|
Hours:+Midnight+to+3:00+AM|
Ghouls,+Goblins,+and+Vampires|
Bring+your+own+wooden+stake

بازگشت به بالا


پین ها

می توانید انواع پین ها را با نمادها و/یا رشته های متنی کوتاه بسازید. در اینجا انواع پین موجود است.

نوع پین ثابت حباب مثال ها
پین ساده با یک حرف یا نماد

chst=d_map_pin_letter[ _withshadow ]
chst=d_map_pin_icon[ _withshadow ]

Plain pin with letterPlain pin with icon
پین مایل/ستاره دار با تک حرف یا نماد

chst=d_map_xpin_letter[ _withshadow ]
chst=d_map_xpin_icon[ _withshadow ]

پین مقیاس پذیر، قابل چرخش، چند خطی chst=d_map_spin Scalable, rotatable pin

پین ساده با یک حرف یا نماد

این یک پین کوچک و راست است که می تواند یک نماد کوچک یا یک حرف را در خود جای دهد.

نحو حروف

chst=d_map_pin_letter[_withshadow]
chld=<character>|<fill_color>|<text_color>

نحو آیکون

chst=d_map_pin_icon[_withshadow]
chld=<icon_string>|<fill_color>
< شخصیت >
[ فقط پین های متن ] یک کاراکتر متنی.
< icon_string >
[ فقط پین‌های نماد ] رشته‌ای که یکی از نمادهای شرح داده شده در انتهای این سند را مشخص می‌کند.
< fill_color >
رنگ پر حباب، به عنوان یک رنگ شش رقمی HTML هگزادسیمال.
< text_color >
[ فقط پین های متن ] رنگ متن، به عنوان یک رنگ هگزادسیمال HTML شش رقمی.

فقط سایه

برای ترسیم سایه فقط برای این نوع پین، از این نحو استفاده کنید:

chst=d_map_pin_shadow

پارامتر chld فقط برای یک سایه مورد نیاز نیست.

مثال ها


chst=d_map_pin_letter_withshadow
chld=A|FF0000|0000FF

chst=d_map_pin_letter
chld=%E5%8D%B1|FF0000|000000

chst=d_map_pin_icon
chld=camping|ADDE63

chst=d_map_pin_shadow

بازگشت به بالا


پین مایل/ستاره دار با تک حرف یا نماد

این یک پین کوچک است که می‌تواند به چپ یا راست خم شود یا یک ستاره همپوشانی داشته باشد. محتویات پین می تواند یک کاراکتر یا یک نماد کوچک باشد.

نحو حروف

chst=d_map_xpin_letter[_withshadow]
chld=<pin_style>|<character>|<fill_color>|<text_color>|<star_fill_color>

نحو آیکون

chst=d_map_xpin_icon[_withshadow]
chld=<pin_style>|<icon_string>|<fill_color>|<star_fill_color>
< pin_style >
سبک سنجاق. یکی از ثابت های زیر را انتخاب کنید:
  • pin
  • pin_star
  • pin_sleft
  • pin_sright
< icon_string >
[ پین‌های نماد ] رشته‌ای که یکی از نمادهای شرح داده شده در انتهای این سند را مشخص می‌کند.
< شخصیت >
[ پین های متن ] یک کاراکتر متنی.
< fill_color >
رنگ پر حباب، به عنوان یک رنگ شش رقمی HTML هگزادسیمال.
< text_color >
[ پین های متن ] رنگ متن، به عنوان یک رنگ هگزادسیمال HTML شش رقمی.
< star_fill_color >
[ پین های ستاره ] رنگ پر ستاره، به عنوان یک رنگ هگزادسیمال HTML شش رقمی.

فقط سایه

برای ترسیم سایه فقط برای این نوع پین، از این نحو استفاده کنید:

chst=d_map_xpin_shadow

chld=<pin_style>

مثال ها


chst=d_map_xpin_letter
chld=pin_star|A|FF0000|000000

chst=d_map_xpin_letter
chld=pin_sleft|A|FF0000|000000

chst=d_map_xpin_icon
chld=pin_sleft|bank-dollar|52B552

chst=d_map_xpin_shadow
chld=pin_sleft

بازگشت به بالا


پین متن با مقیاس بندی و چرخش

این یک پین است که می توانید به صورت دستی آن را برای گنجاندن رشته های متنی طولانی تر مقیاس کنید. همچنین می توانید پین را به مقدار دلخواه بچرخانید و اندازه و رنگ فونت را کنترل کنید.

نحو

chst=d_map_spin
chld=<scale_factor>|<rotation_deg>|<fill_color>|<font_size>|<font_style>|<text_line_1>|...|<text_line_n>
< scale_factor >
یک عامل مقیاس برای تعیین اندازه پین. این یک عدد ممیز شناور مثبت است که در آن 0.5 اندازه پین ​​های بدون مقیاس است. 0.25 نصف آن اندازه، 1 دو برابر آن اندازه خواهد بود و غیره.
< rotation_deg >
چرخش پین، بر حسب درجه. مقادیر مثبت و منفی مجاز هستند. 0 را برای پین عمودی مشخص کنید.
< fill_color >
رنگ پر حباب، به عنوان یک رنگ شش رقمی HTML هگزادسیمال.
< font_size >
اندازه فونت متن، بر حسب پیکسل.
< font_style >
یا '_' (زیر خط) برای متن معمولی یا 'b' برای متن پررنگ.
< text_ line_1 >...< text_ line_n >
یک یا چند خط متن، با | شخصیت ها.

مثال ها


chst=d_map_spin
chld=1.7|180|C6E7DE|11|_|Raindrop

chst=d_map_spin
chld=2.1|0|FFFF42|13|b|Kumquats

chst=d_map_spin
chld=3|45|FFFF42|11|_|First+line|Second+line

بازگشت به بالا


یادداشت های سبک سرگرم کننده

Arrow style note

می توانید یادداشت های متنی مختلفی را در قالب های جدید ایجاد کنید، مانند یادداشت چسبنده یا حباب فکری. می توانید به صورت اختیاری یک خط عنوان را در یادداشت قرار دهید.

این یادداشت ها دارای اندازه ثابت هستند. آنها به اندازه متن شما بزرگ یا کوچک نمی شوند.

نحو

chst=d_fnote_title OR chst=d_fnote
chld=<note_type>|<note_size>|<text_color>|<text_alignment>|<text_line_1>|...|<text_line_n>
chst
d_fnote_title برای یادداشت با عنوان یا d_fnote برای یادداشت بدون عنوان مشخص کنید. در یک یادداشت با عنوان، خط اول متن به عنوان یک عنوان (بزرگتر و پررنگ) قالب بندی می شود.
< note_type >
رشته ای که شکل نت را توصیف می کند. یکی از رشته های نوع نت را در جدول زیر انتخاب کنید.
< note_size >
1 (یک) برای یک نت بزرگ یا 2 برای یک نت کوچک. اندازه قالب ثابت است. الگوها رشد نمی کنند یا کوچک نمی شوند تا متن مناسب باشند. با هر دو اندازه آزمایش کنید تا ببینید کدام یک متن شما را بهتر نگه می دارد.
< text_color >
رنگ متن، به عنوان یک رنگ شش رقمی هگزادسیمال. مقادیر آلفا پذیرفته نمی شوند.
< text_alignment >
تراز برای تمام متن، از جمله سرصفحه. یکی از مقادیر زیر را انتخاب کنید:
  • l - ('L') تراز چپ
  • h - تراز وسط
  • r - تراز راست
< text_line_1 >| ...|< text_ line_n >
متن برای یادداشت. از | استفاده کنید کاراکتر برای نشان دادن یک خط جدید. وقتی chst=d_fnote_title ، خط اول متن به عنوان یک عنوان قالب بندی می شود.

یادداشت Type Templates

الگوهای زیر برای الگوهای یادداشت پشتیبانی می شوند. رشته note_type برای هر کدام در زیر الگو نشان داده شده است.

توجه: رشته های متنی به حروف بزرگ و کوچک حساس هستند!


arrow_d

balloon

pinned_c

sticky_y

taped_y

thought

مثال ها

شرح مثال
یادداشت با عنوان: chst=d_fnote_title . خط اول متن به عنوان عنوان استفاده می شود. اندازه نت بزرگ است (1).
chst=d_fnote_title
chld=pinned_c|1|004400|l|Joe's|Today+2-for-1+!|555-1234
یادداشت بدون عنوان: chst=d_fnote. متن در مرکز قرار دارد.
chst=d_fnote
chld=thought|1|0088FF|h|Why+am+I+here?

یک قالب مفید برای یک جوک قدیمی.


chst=d_fnote
chld=arrow_d|1|000000|h|Your|shoe's|untied

بازگشت به بالا


یادداشت های پیش بینی آب و هوا

می توانید با نماد نشانگر آب و هوا یادداشت ایجاد کنید. طرح‌بندی مشابه یادداشت‌های سبک سرگرم‌کننده است، اما رنگ متن همیشه سیاه است، متن همیشه تراز چپ است، و شما فقط می‌توانید از یک تا سه خط متن داشته باشید.

این یادداشت ها دارای اندازه ثابت هستند. آنها به اندازه متن شما بزرگ یا کوچک نمی شوند.

نحو

chst=d_weather
chld=<note_type>|<weather_icon>|<title>|<line_2>|<line_3>
chst
d_weather یک یادداشت آب و هوا را نشان می دهد.
< note_type >
الگوی مورد استفاده برای این یادداشت. از یکی از رشته های یادداشت ذکر شده در لیست یادداشت سبک سرگرم کننده در بالا استفاده کنید.
< weather_icon >
یکی از رشته های نماد آب و هوا در جدول زیر. یک یادداشت می تواند یک نماد آب و هوا را بگیرد.
< عنوان >|< خط_2 >|< خط_3 >
عنوان، به علاوه حداکثر دو خط متن دیگر (این خطوط متن اضافی اختیاری هستند). عنوان بزرگتر و پررنگ است.

نمادهای آب و هوا

در اینجا لیستی از نمادهای آب و هوا پشتیبانی می شود که رشته weather_icon را برای هر کدام نشان می دهد.

توجه: رشته های متنی به حروف بزرگ و کوچک حساس هستند!


clear-night-moon

cloudy-heavy

cloudy-sunny

cloudy

rain

rainy-sunny

snow

snowflake

snowy-sunny

sunny-cloudy

sunny

thermometer-cold

thermometer-hot

thunder

windy

مثال ها

شرح مثال
یک یادداشت آب و هوا با عنوان و دو خط روی یک الگوی سبک taped_y .

chst=d_weather
chld=taped_y|sunny|Barcelona|max+25°C|min+15°C

یک فکر آرزویی برای زمستان.

chst=d_fnote
chld=thought|sunny|I+wish...

بازگشت به بالا


بلوک های متن فونت مشخص شده (فقط متن)

Arrow style note

می توانید یک بلوک از متن مشخص شده با پس زمینه سفید ایجاد کنید. اگر متن + نماد می‌خواهید، از تنوع تک خطی استفاده کنید که از یک نماد پشتیبانی می‌کند.

نحو

chst=d_text_outline
chld=<text_fill_color>|<font_size>|<text_alignment>|<outline_color>|<font_weight>|<text_line_1>|...|<text_line_n>
< text_fill_color >
رنگ پر کردن متن این یک رنگ شش رقمی هگزادسیمال است. مقادیر آلفا پذیرفته نمی شوند.
< font_size >
عددی که اندازه فونت را بر حسب پیکسل مشخص می کند.
< text_alignment >
تراز برای تمام متن، از جمله سرصفحه. یکی از مقادیر زیر را انتخاب کنید:
  • l - ('L') تراز چپ
  • h - تراز وسط
  • r - تراز راست
< outline_color >
رنگ طرح کلی متن این یک رنگ شش رقمی هگزادسیمال است. مقادیر آلفا پذیرفته نمی شوند.
< font_weight >
متن معمولی یا پررنگ. برای متن معمولی زیر «_» و برای متن پررنگ «b» علامت بزنید.
< text_line_1 >| ...|< text_ line_n >
متن برای یادداشت. از | استفاده کنید کاراکتر برای نشان دادن یک خط جدید. وقتی chst=d_fnote_title ، خط اول متن به عنوان یک عنوان قالب بندی می شود.

مثال ها



chst=d_text_outline
chld=FFCC33|16|h|FF0000|b|Mad+Scientist|Boo


chst=d_text_outline
chld=FF65BB|20|h|00FF00|_|Freshly+Made+Pie

بازگشت به بالا


بلوک های متن فونت مشخص شده (متن + نماد)

می‌توانید یک خط متن مشخص به اضافه یک نماد در بالا، چپ، پایین یا راست بلوک ایجاد کنید. اگر به نماد نیاز ندارید، از بلوک متن فونت مشخص شده استفاده کنید.

نحو

chst=<icon_position_string>
chld=<text>|<font_size>|<font_fill_color>|<icon_name>|<icon_size>|<icon_fill_color>|<icon_and_text_border_color>
< icon_position_string >
محل نمایش نماد در کادر متن را مشخص می کند. یکی از مقادیر زیر را انتخاب کنید:
  • d_simple_text_icon_below - نماد را در پایین کادر قرار می دهد: Icon on the bottom.
  • d_simple_text_icon_above - نماد را در بالای کادر قرار می دهد: Icon on the top.
  • d_simple_text_icon_left - نماد را در سمت چپ کادر قرار می دهد: Icon on the left.
  • d_simple_text_icon_right - نماد را در سمت راست کادر قرار می دهد: Icon on the right.
< متن >
متن برای نشان دادن فقط یک خط؛ از + برای فضاها استفاده کنید.
< font_size >
عددی که اندازه فونت را بر حسب پیکسل مشخص می کند.
< font_fill_color >
رنگ پر کردن متن، به عنوان یک رشته شش رقمی. مقادیر آلفا پشتیبانی نمی شوند.
< icon_name >
یکی از نام‌های نماد در پایین این سند فهرست شده است.
< icon_size >
ارتفاع نماد بر حسب پیکسل. مقادیر زیر پشتیبانی می شوند: 12، 16، 24.
< icon_fill_color >
رنگ آیکون، به عنوان یک رشته شش رقمی. مقادیر آلفا پشتیبانی نمی شوند.
< icon_and_text_border_color >
رنگ حاشیه دور آیکون و متن به صورت یک رشته شش رقمی. مقادیر آلفا پشتیبانی نمی شوند.

بازگشت به بالا

لیست پرچم ها و نمادهای موجود

با استفاده از پارامتر مناسب می توان از تصاویر زیر در آیکون های پویا استفاده کرد.

توجه: رشته های متنی به حروف بزرگ و کوچک حساس هستند

توجه: آیکون ها فقط در اندازه های زیر موجود هستند: 12، 16، 24.

آیکون های اصلی

نمادها از Glyphish.com

این نمادها توسط Joseph Wain / glyphish.com هستند. این اثر تحت مجوز Creative Commons Attribution 3.0 ایالات متحده مجوز دارد.

Flags

Here are flags for some countries and territories.

Back to top

Text Strings

All display text sent in the request must be UTF-8 encoded and then URL-encoded. This affects only non-URL-safe characters (URL-safe characters are mostly the English letters az both upper and lower case, plus plus a small set of punctuation). For example, the UTF-8 and URL-encoded value for the letter "è" is " %C3%A8 ", and for the Chinese character 駅 is " %E9%A7%85 ". Most browsers will let you use an unencoded value in the URL string (for example, 駅) and will encode it for you behind the scenes. However, it is possible that someone viewing your image URL is using a browser that doesn't do this, so it is usually best to UTF-8 and URL-encode all non-ASCII characters in text strings. Note that this is only for the text shown in bubbles or pins, not for the &, |, or other characters that are part of the URL syntax.

Shadows

You can add shadows to many icons, or even draw shadows for some icons without the icon itself!

Shadowed Icons Shadowed pin

Many of these icons can be drawn with or without shadows. If shadowing is an option, the icon name will have a version that ends in _withshadow and another version without that ending. You can specify an icon with either ending, depending on whether you want the shadow or not.

Here's an example of a medium text bubble and a pin with and without shadows:

Bubble without shadow
chst=d_bubble_icon_text_big
Bubble with shadow
chst=d_bubble_icon_text_big_withshadow
Plain pin with icon
chst=d_map_pin_icon
Plain shadowed pin with icon
chst=d_map_pin_icon_withshadow

Freestanding Shadows Shadow only

Some icon types allow you to draw their shadow by itself. You might want to do this if you are using several overlapping shadowed icons on a graphic, and they are so close that the shadow from one falls across another graphic. See the documentation of your specific icon type to learn whether you can draw its shadow alone.

Back to top