ไอคอนแบบไดนามิก

   

หน้าอ้างอิงไอคอนแบบไดนามิกอินโฟกราฟิกจะอธิบายประเภทเครื่องหมายแบบไดนามิกทุกประเภทที่มีให้บริการ

หน้านี้จะอธิบายวิธีสร้างข้อความไฮไลต์ ลูกโป่ง หมุด และกราฟิกอื่นๆ อย่างหลากหลายที่ URL ขอหรือเพิ่มเป็นเครื่องหมายที่ด้านบนของแผนภูมิอื่นๆ ได้

สารบัญ

1. บทนำ
   1. ไอคอนแบบลอย
   2. เครื่องหมายแบบไดนามิก
2. ฟีเจอร์ทั่วไปของไอคอน
   1. สตริงข้อความ
   2. เงา
3. ไอคอนตามบริบท

บทนำ

Chart API ช่วยให้คุณสร้างข้อความไฮไลต์ หมุด หรือลูกโป่งที่น่าสนใจหลากหลายรูปแบบซึ่งมีข้อความและรูปภาพผสมกัน รายการเหล่านี้เรียกว่าไอคอนแบบไดนามิก คุณจะสร้างรูปภาพไอคอนแบบไดนามิกแบบตั้งอิสระ หรือวางตำแหน่งไอคอนแบบไดนามิกที่ด้านบนของแผนภูมิเป็นประเภทเครื่องหมายโดยใช้พารามิเตอร์ chem ก็ได้ หน้านี้อธิบายวิธีสร้างไอคอนแบบไดนามิกเป็น รูปภาพแบบลอยหรือเป็นเครื่องหมายบนแผนภูมิอื่น หน้าอ้างอิงไอคอนแบบไดนามิกอินโฟกราฟิกจะอธิบายประเภทเครื่องหมายแบบไดนามิกทุกประเภทที่มีให้บริการ

ไวยากรณ์สำหรับการสร้างไอคอนแบบไดนามิกขึ้นอยู่กับว่าคุณต้องการไอคอนแบบลอยหรือเป็นเครื่องหมายแบบไดนามิกในแผนภูมิอื่น

ไอคอนแบบลอย

คุณขอรูปภาพไอคอนแบบไดนามิกได้ด้วยวิธีเดียวกับที่ขอแผนภูมิอื่นๆ ไอคอนแบบไดนามิกแบบลอยรองรับชุดพารามิเตอร์ที่แตกต่างจากแผนภูมิอื่นๆ ดังนี้

พารามิเตอร์	ต้องระบุหรือไม่บังคับ	คำอธิบาย
chst=<icon_string_constant>	จำเป็น	อธิบายว่าควรสร้างไอคอนประเภทใด icon_string_constant - ค่าคงที่สตริงที่อธิบายประเภทไอคอนที่จะสร้าง ดูการเลือกไอคอนด้านล่างเพื่อเลือกไอคอน
chld=<icon_data>	จำเป็น	ข้อมูลเฉพาะที่ใช้เพื่ออธิบายขนาด การหมุน ข้อความ และข้อมูลอื่นๆ ของไอคอน icon_data - ชุดค่าที่คั่นด้วยอักขระไปป์ที่เหมาะสมกับไอคอน เอกสารในหน้านี้จะอธิบายถึงค่าที่จำเป็นสำหรับไอคอนแต่ละประเภท
cht	ไม่ได้ใช้	แผนภูมิไอคอนแบบไดนามิกแบบอิสระจะไม่ใช้พารามิเตอร์ cht
chs	ไม่ได้ใช้	แผนภูมิไอคอนแบบไดนามิกแบบอิสระจะไม่ใช้พารามิเตอร์ chs
chd	ไม่ได้ใช้	ใช้พารามิเตอร์ chld เพื่อส่งข้อมูลไปยังไอคอนแบบไดนามิกแบบลอย

ตัวอย่าง

https://chart.googleapis.com/chart?chst=d_bubble_icon_text_small&chld=ski|bb|Wheeee!|FFFFFF|000000

เครื่องหมายแบบไดนามิก

คุณฝังไอคอนแบบไดนามิกเป็นประเภทเครื่องหมายในแผนภูมิประเภทต่างๆ ได้โดยใช้พารามิเตอร์ chem ดูวิธีการได้ที่เอกสารประกอบเกี่ยวกับ chem

ตัวอย่าง

https://chart.googleapis.com/chart?
  chs=300x140
  cht=lc&chco=FF9900,224499
  chd=t:75,74,66,30,10,5,3,1
  chls=1|1
  chem=y;s=bubble_icon_text_small;d=ski,bb,Wheeee!,FFFFFF;dp=2;ds=0
  chm=v,ccccFF,0,::.2,2

ฟีเจอร์ทั่วไปของไอคอน

ไอคอนส่วนใหญ่อาจมีสตริงข้อความหรือเงาที่เกี่ยวข้องอยู่

สตริงข้อความ

ข้อความที่แสดงทั้งหมดที่ส่งไปยัง Chart API จะต้องเข้ารหัส UTF-8 และเข้ารหัส URL โดยจะมีผลเฉพาะกับอักขระที่ไม่ปลอดภัยต่อ URL เท่านั้น (อักขระที่ใช้ URL ปลอดภัยส่วนใหญ่จะเป็นตัวอักษรภาษาอังกฤษ a-z ทั้งตัวพิมพ์ใหญ่และตัวพิมพ์เล็ก รวมถึงชุดเครื่องหมายวรรคตอนขนาดเล็ก) เช่น ค่าที่เข้ารหัส UTF-8 กับ URL สำหรับตัวอักษร "è" คือ "%C3%A8" และสำหรับอักขระจีน 駅 คือ "%E9%A7%85" เบราว์เซอร์ส่วนใหญ่จะให้คุณใช้ค่าที่ไม่เข้ารหัสในสตริง URL (เช่น 駅) และจะเข้ารหัสข้อมูลดังกล่าวในเบื้องหลัง อย่างไรก็ตาม เป็นไปได้ว่าผู้ที่ดู URL ของแผนภูมิจะใช้เบราว์เซอร์ที่ไม่ได้ใช้ดังกล่าว ดังนั้นวิธีที่ดีที่สุดคือ UTF-8 และเข้ารหัส URL อักขระทั้งหมดที่ไม่ใช่ ASCII ในสตริงข้อความ โปรดทราบว่านี่เป็นข้อมูลสำหรับข้อความที่แสดงในลูกโป่งหรือหมุดเท่านั้น ไม่ใช่สำหรับอักขระ &, | หรืออักขระอื่นๆ ที่เป็นส่วนหนึ่งของไวยากรณ์ URL

เมื่อใช้พารามิเตอร์ chem เพื่อระบุตัวทำเครื่องหมายไอคอนแบบไดนามิก คุณต้องไม่ใช้อักขระบางตัวในข้อความด้วย ตามที่อธิบายไว้ในเอกสารประกอบ chem

เงา

คุณจะเพิ่มเงาลงในไอคอนจำนวนมาก หรือจะวาดเงาสำหรับไอคอนบางรายการโดยไม่ต้องใช้ไอคอนก็ได้

ไอคอนมีเงา

ไอคอนเหล่านี้ส่วนใหญ่วาดแบบมีหรือไม่มีเงาก็ได้ หากมีการใส่เงาเป็นตัวเลือก ชื่อไอคอนจะมีเวอร์ชันที่ลงท้ายด้วย _withshadow และอีกเวอร์ชันหนึ่งที่ไม่มีนามสกุลดังกล่าว คุณจะระบุไอคอนที่มีส่วนท้ายอย่างใดอย่างหนึ่งก็ได้ ทั้งนี้ขึ้นอยู่กับว่าคุณต้องการเงาหรือไม่

ต่อไปนี้เป็นตัวอย่างของลูกโป่งข้อความขนาดกลางและหมุดที่มีและไม่มีเงา

chst=d_bubble_icon_text_big	chst=d_bubble_icon_text_big_withshadow
chst=d_map_pin_icon	chst=d_map_pin_icon_withshadow

เงาตั้งอย่างอิสระ

ไอคอนบางประเภทอาจให้คุณวาดเงาออกมาได้ด้วยตัวเอง คุณอาจต้องการทำเช่นนี้หากใช้ไอคอนที่มีเงาซ้อนกันหลายไอคอนในกราฟิก และไอคอนอยู่ใกล้จนเงาจากไอคอนหนึ่งตกทับอีกไอคอนหนึ่ง เช่น นี่คือลูกโป่งเงา 2 ลูก โดยโรเบิร์ตวาดก่อน ตามด้วยอลิซ

ดูว่าเงาของอลิซปกคลุมบางส่วนของโรเบิร์ตอย่างไร หากต้องการแก้ไขปัญหานี้ ให้ลองวาดเงาอลิซก่อน ต่อด้วยบับเบิลโรเบิร์ต แล้ววาดอลิซโดยไม่มีเงา อาจไม่ค่อยสมจริงในแง่ของแสงและเงา แต่หลีกเลี่ยงการบังลูกโป่งอีกฟองหนึ่งด้วยเงาของอีกฟองหนึ่ง

chem=
  y;s=bubble_text_small_shadow;d=bb,Alice,FF8,000;ds=0;dp=1;py=1          // Alice, no shadow
  y;s=bubble_text_small_withshadow;d=bbtr,Robert,FF8,000;ds=0;dp=3.5;py=1 // Robert with shadow
  y;s=bubble_text_small;d=bb,Alice,FF8,000;ds=0;dp=1;py=1                 // Alice shadow

เครื่องหมายทั้งหมดระบุลำดับ Z เดียวกันของ 1 (py=1) จึงถูกวาดตามลำดับที่ระบุที่ด้านบนขององค์ประกอบของแผนภูมิ (เส้นของแผนภูมิ) ก่อนอื่นต้องวาดเงาของอลิซ จากนั้นมีลูกโป่งโรเบิร์ตที่ด้านบน และสุดท้ายมีลูกโป่งอลิซที่ด้านบน

ดูเอกสารประกอบของประเภทไอคอนที่เจาะจงเพื่อให้ทราบว่าคุณสามารถวาดเงาเพียงอย่างเดียวได้หรือไม่

ไอคอนตามบริบท

คุณสามารถระบุไอคอนที่มีสี ขนาด หรือการซ้อนกันตามจุดที่กำหนดไว้ได้ ไอคอนประเภทเหล่านี้ใช้เป็นเครื่องหมายไอคอนแบบไดนามิกเท่านั้น (พารามิเตอร์ chem) ไม่ใช่ไอคอนแบบอิสระ

ไอคอนเหล่านี้อาจแสดงในชุดอื่นๆ นอกเหนือจากชุดที่ระบุสี ขนาด หรือข้อมูลซ้อนกันได้ ซึ่งหมายความว่าค่า ds ของพารามิเตอร์ chem จะระบุชุดที่จะแสดงไอคอน แต่ระบุค่าสำหรับกำหนดขนาดหรือสีของไอคอนจะระบุไว้ในพารามิเตอร์ด้านล่าง ประโยชน์อย่างหนึ่งคือการใช้ชุดข้อมูลที่ซ่อนอยู่สำหรับข้อมูลไอคอน แต่แสดงผลไอคอนบนเส้นหรือแถบที่มองเห็นได้ โดยมีตัวอย่างดังนี้

ไอคอนแสดงในชุดแหล่งที่มา	ไอคอนแสดงในซีรีส์ที่ไม่ใช่ต้นฉบับ	ไอคอนใช้ซีรีส์ที่ซ่อนอยู่
chem=   y;s=cm_size;ds=0;...;   d=maps_pin,0,10,50,10,8F8,000,hb ds=0 - แสดงผลในชุด 0 (เส้นสีแดง) d=maps_pin,0,... - ข้อมูลจากชุด 0	chem=   y;s=cm_size;ds=1;...;   d=maps_pin,0,10,50,10,8F8,000,hb ds=1 - แสดงผลในชุดที่ 1 (เส้นสีน้ำเงิน) d=maps_pin,0,.. - ข้อมูลจากชุด 0	chd=t1:   10,20,30,5,10,60   10,20,30,70,60,5 chem=   y;s=cm_size;ds=0;dp=all;   d=disk,1,5,20,5,FFFF10,000 t1: - แสดงชุดแรกและข้อมูลเส้นที่ใช้ ระบบซ่อนชุดต่อๆ ไปทั้งหมดไว้ ds=0 - เครื่องหมายแสดงในอนุกรม 0 d=disk,1,... - ข้อมูลดิสก์มาจากชุดที่ 1 ที่ซ่อนอยู่

ประเภทเครื่องหมายบริบท

ประเภทเครื่องหมาย	ค่าของ chem วินาที	ตัวอย่าง
ความแตกต่างของสี	s=cm_color
ความแตกต่างของขนาด	s=cm_size
ความแตกต่างของสีและขนาด	s=cm_color_size
รูปแบบกองซ้อน	s=cm_repeat
กองซ้อนและรูปแบบสี	s=cm_repeat_color

สตริงการปรับแนวสำหรับไอคอนตามบริบท

ไอคอนบริบทรองรับสตริงการจัดแนวที่ไม่บังคับเพื่อระบุการปรับแนวและออฟเซ็ตของไอคอนกับจุดข้อมูล สตริงนี้มีไวยากรณ์ต่อไปนี้

<alignment>[+/-<h_anchor_offset>+/-<v_anchor_offset>]

alignment

ตัวอักษร 2 ตัวที่อธิบายการปรับแนวของไอคอนให้ตรงกับจุด เช่น tl (ซ้ายบน) และ rb (ขวาล่าง) โปรดดูคำอธิบายพารามิเตอร์ alignment_string ของพารามิเตอร์ chem เพื่อดูข้อมูลและคำอธิบายที่ครบถ้วน

h_anchor_offset

[ไม่บังคับ] ออฟเซ็ตแนวนอนของจุดยึด หน่วยเป็นพิกเซล ค่ารวมถึง 0 ต้องนำหน้าด้วย + หรือ - สำคัญ: คุณต้องเข้ารหัส URL + เป็น %2B

v_anchor_offset

[ไม่บังคับ] ค่าออฟเซ็ตแนวตั้งของจุดยึด หน่วยเป็นพิกเซล ค่ารวมถึง 0 ต้องนำหน้าด้วย + หรือ - สำคัญ: คุณต้องเข้ารหัส URL + เป็น %2B

โปรดทราบว่าคุณจะใช้คอมโพเนนต์ of ของพารามิเตอร์ chem เพื่อระบุออฟเซ็ตแนวนอนและแนวตั้งได้ด้วย หากคุณระบุทั้งคอมโพเนนต์ of และค่า h_anchor_offset v_anchor_offset ออฟเซ็ตทั้งหมดจะมีผลกับไอคอน

ตัวอย่าง

hb-0-0 กึ่งกลางแนวนอนด้านล่าง ไม่มีออฟเซ็ต	lb-0-0 ด้านล่างซ้าย ไม่มีออฟเซ็ต	rb-0-0 ด้านล่างขวา ไม่มีออฟเซ็ต	ht-0-0 ด้านบนแนวนอน ไม่มีออฟเซ็ต
hb-20-0 ตรงกลางแนวนอน - ด้านล่าง -20 แนวนอน 0 แนวตั้ง	hb%2b20-0 ตรงกลางแนวนอน - ด้านล่าง แนวนอน +20 แนวตั้ง 0 รายการ	hb-0%2b10 กึ่งกลางแนวนอนด้านล่าง 0 แนวนอน +10 แนวตั้ง	hb-0-20 ตรงกลางแนวนอน - ล่าง แนวนอน 0 แนวนอน -20 แนวตั้ง

รูปแบบสี (cm_color)

คุณสามารถกำหนดสีของเครื่องหมายในแผนภูมิตามบริบทได้หลากหลายตามจุดที่แสดง คุณต้องระบุช่วงสี และค่าข้อมูลจะได้รับการปรับขนาดเป็นสีที่สอดคล้องกันในช่วงดังกล่าว

ไวยากรณ์

chem=y;s=cm_color;ds=<series_rendering_index>; ...other_values... ;
  d=<icon_shape>,<color_data_series>,<low_color>,<middle_color>,<high_color>,<icon_size>,<outline_color>,<alignment>

<icon_shape>

ไอคอนที่จะใช้ ระบุสตริงรหัสที่ระบุหนึ่งในรูปภาพที่แสดงอยู่ตอนท้ายของหน้าเว็บ

<color_data_series>

ดัชนีฐาน 0 ของชุดข้อมูลที่ใช้เพื่อทำให้สีของไอคอนแตกต่างกัน

<low_color>

ค่าสีระดับต่ำในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ซึ่งจะเชื่อมโยงกับค่าต่ำสุดที่เป็นไปได้ในช่วงข้อมูลที่มี

<middle_color>

ค่าสีตรงกลางในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ค่านี้เชื่อมโยงกับค่าตรงกลางในช่วงข้อมูลที่มี

<high_color>

ค่าสีระดับสูงในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ซึ่งจะเชื่อมโยงกับค่าสูงสุดที่เป็นไปได้ในช่วงข้อมูลที่มี

<icon_size>

ขนาดไอคอนในหน่วยพิกเซล ค่าที่รองรับมีดังนี้ 12, 16, 24

<outline_color>

สีเติมขอบของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<alignment>

สตริงที่ไม่บังคับที่อธิบายการปรับแนวไอคอนและออฟเซ็ต

ตัวอย่าง

s=cm_color - ไอคอนรูปแบบสี ds=0 - แสดงผลในชุดข้อมูล 0 dp=all - วางไอคอนในทุกจุด ค่า d: petrol - ตัวระบุไอคอน 0 - สีจากชุดข้อมูล 0 000,0FF,F55 - คำจำกัดความของสเกลสี 24 - ขนาดของไอคอน 000 - เส้นขอบสีดำ hv - จัดไอคอนให้อยู่กึ่งกลางโดยมีจุดทั้งในแนวนอนและแนวตั้ง

chem=y;s=cm_color;   ds=0;   dp=all;   d=petrol,0,000,0FF,F55,24,000,hv

กลับไปด้านบน

 

 

---

รูปแบบขนาด (cm_size)

คุณสามารถเปลี่ยนแปลงขนาดของตัวทำเครื่องหมายแผนภูมิตามบริบทได้เพียงอย่างเดียวตามชุดข้อมูลที่คุณต้องการ

ไวยากรณ์

chem=y;s=cm_size;ds=<series_rendering_index>; ...other_values... ;
  d=<icon_type>,<size_data_series>,<zero_value_size>,<size_multiplier>,<min_size>,<outline_color>,<fill_color>,<alignment>

<icon_type>

รูปร่างของไอคอน เลือกค่าใดค่าหนึ่งต่อไปนี้: maps_pin, disk หรือ square

<size_data_series>

ดัชนีฐาน 0 ของชุดข้อมูลซึ่งใช้เพื่อปรับเปลี่ยนขนาดของไอคอน

<zero_value_size>

ขนาดพื้นฐานของไอคอนตามค่าข้อมูลต่ำสุดของชุด

<size_multiplier>

ปัจจัยการปรับขนาดขนาด ค่านี้จะคูณกับผลต่างระหว่างค่าข้อมูลของแต่ละไอคอนและค่าชุดขั้นต่ำเพื่อคำนวณขนาดไอคอนสุดท้าย ดังนั้น ไอคอนที่ค่าข้อมูล 0 จะไม่ได้รับผลกระทบจากตัวคูณนี้

<min_size>

ขนาดขั้นต่ำของไอคอนในหน่วยพิกเซล

<outline_color>

สีเติมขอบของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<fill_color>

สีเติมของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<alignment>

สตริงที่ไม่บังคับที่อธิบายการปรับแนวไอคอนและออฟเซ็ต

ตัวอย่าง

ตัวอย่างพื้นฐาน ระบบจะแสดงไอคอนที่มีค่าเป็น 0 ในขนาดค่าศูนย์ ซึ่งก็คือ 30 พิกเซล ขนาดจะเพิ่มขึ้นพร้อมกับข้อมูล

chd=t:0,10,20,30,40,50,60,70 chem=y;s=cm_size;ds=0;dp=all;py=-1;d=maps_pin,0,30,100,10,8F8,000,hb

ในตัวอย่างนี้ ไอคอนจะใช้ข้อมูลขนาดจากเส้นสีเหลือง แต่แสดงผลเป็นเส้นสีน้ำเงิน chem=y - เครื่องหมายแบบไดนามิก s=cm_size - ความแปรปรวนของขนาด ds=1 - แสดงในชุดข้อมูลที่ 1 (เส้นสีน้ำเงิน) dp=all - แสดงผลในทุกจุด d= maps_pin - ใช้ไอคอนหมุดแผนที่ 0 - ปรับขนาดตามชุดข้อมูล 0 (เส้นสีเหลือง) 10 - ขนาดหมุดที่ค่า 0 90 - ตัวคูณขนาด 10 - ขนาดต่ำสุด 8F8 - เติมสี 000 - สีเติมขอบ hb - จัดตำแหน่งกึ่งกลางในแนวนอนที่ด้านล่างของหมุด

chem=chem=y;s=cm_size;ds=1;dp=all;d=maps_pin,0,10,90,10,8F8,000,hb

กลับไปด้านบน

 

 

---

รูปแบบสีและขนาด (cm_color_size)

คุณสามารถเปลี่ยนแปลงทั้งสีและขนาดของตัวทำเครื่องหมายแผนภูมิตามบริบทได้ตามชุดข้อมูลที่คุณต้องการ

ไวยากรณ์

chem=y;s=cm_color_size;ds=<series_rendering_index>; ...other_values... ;
  d=<icon_type>,<color_data_series>,<low_color>,<middle_color>,<high_color>,<size_data_series>,<zero_value_size>,<size_multiplier>,<min_size>,<outline_color>,<alignment>

<icon_type>

รูปร่างของไอคอน เลือกค่าใดค่าหนึ่งต่อไปนี้: maps_pin, disk หรือ square

<color_data_series>

ดัชนีฐาน 0 ของชุดข้อมูลที่ใช้เพื่อทำให้สีของไอคอนแตกต่างกัน

<low_color>

ค่าสีระดับต่ำในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ซึ่งจะเชื่อมโยงกับค่าต่ำสุดที่เป็นไปได้ในช่วงข้อมูลที่มี

<middle_color>

ค่าสีตรงกลางในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ค่านี้เชื่อมโยงกับค่าตรงกลางในช่วงข้อมูลที่มี

<high_color>

ค่าสีระดับสูงในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ซึ่งจะเชื่อมโยงกับค่าสูงสุดที่เป็นไปได้ในช่วงข้อมูลที่มี

<size_data_series>

ดัชนีฐาน 0 ของชุดข้อมูลซึ่งใช้เพื่อปรับเปลี่ยนขนาดของไอคอน

<zero_value_size>

ขนาดพื้นฐานของไอคอนตามค่าข้อมูลต่ำสุดของชุด

<size_multiplier>

ปัจจัยการปรับขนาดขนาด ค่านี้จะคูณกับผลต่างระหว่างค่าข้อมูลของแต่ละไอคอนและค่าชุดขั้นต่ำเพื่อคำนวณขนาดไอคอนสุดท้าย ดังนั้น ไอคอนที่ค่าข้อมูล 0 จะไม่ได้รับผลกระทบจากตัวคูณนี้

<min_size>

ขนาดขั้นต่ำของไอคอนในหน่วยพิกเซล

<outline_color>

สีเติมขอบของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<alignment>

สตริงที่ไม่บังคับที่อธิบายการปรับแนวไอคอนและออฟเซ็ต

ตัวอย่าง

ตัวอย่างนี้ใช้สองบรรทัด หมุดใช้ข้อมูลสีจากชุดข้อมูลที่มีการแสดงผล แต่ใช้ข้อมูลขนาดจากชุดอื่น chd=s:0akAZtnkmi,nbMPJOKXXS - ชุดแรกใช้สำหรับการพล็อตเส้นสีเหลืองและกำหนดสีของหมุด ชุดที่ 2 ใช้กับเส้นสีน้ำเงินและขนาด PIN chem=y - แสดงไอคอนแบบไดนามิก s=cm_color_size - ใช้ไอคอนบริบทของรูปแบบสีและขนาด ds=1 - แสดงผลรายการในชุดข้อมูล 1 ซึ่งเป็นเส้นสีน้ำเงิน dp=all - วางไอคอนในทุกจุด d= maps_pin - ใช้สัญลักษณ์หมุดบนแผนที่ 1 - ใช้ข้อมูลชุดที่ 1 สำหรับสีของ PIN 000,0FF,F55 - สีต่ำ ปานกลาง และสูง 0 - ใช้ชุดข้อมูล 0 สำหรับขนาด PIN 10 - ปักหมุดเท่ากับ 10 พิกเซลที่ค่า 0 90 - ตัวคูณขนาด 90 10 - ขนาด PIN ขั้นต่ำ 10 พิกเซล 000 - สีขอบดำ hb - จัดหมุดไว้ตรงกลางแนวนอนตามขอบด้านล่างกับจุดข้อมูลแต่ละจุด

chd=s:0akAZtnkmi,nbMPJOKXXS chem=y;s=cm_color_size;ds=1;dp=all;d=maps_pin,1,000,0FF,F55,0,10,90,10,000,hb

กลับไปด้านบน

 

 

---

รูปแบบกองซ้อน (cm_repeat)

คุณสามารถปรับความสูงของกลุ่มไอคอนตามค่าข้อมูลในจุดที่ระบุ

ไวยากรณ์

chem=y;s=cm_repeat;ds=<series_rendering_index>; ...other_values... ;
  d=<icon_shape>,<repeat_series_index>,<scaling_factor>,<stacking_direction>,<icon_size>,<fill_color>,<outline_color>,<spacing>,<alignment>

<icon_shape>

ไอคอนที่จะใช้ ระบุสตริงรหัสที่ระบุหนึ่งในรูปภาพที่แสดงอยู่ตอนท้ายของหน้าเว็บ

<repeat_series_index>

ดัชนีฐาน 0 ของชุดข้อมูลซึ่งใช้ในการคำนวณจำนวนไอคอนที่จะวางในจุดนี้

<scaling_factor>

ค่าชุดข้อมูลต้นฉบับจะมีการปรับขนาดเป็นค่าจาก 0 ถึง 1 แล้วคูณด้วยค่านี้เพื่อระบุจำนวนตัวทำเครื่องหมายที่จะวางในจุดนี้ ตัดค่าบางส่วนให้สั้นลง

<stacking_direction>

ทิศทางการซ้อน: "h" (ตัวพิมพ์เล็ก) สำหรับแนวนอน หรือ "V" (ตัวพิมพ์ใหญ่) สำหรับแนวตั้ง

<icon_size>

ขนาดของตัวทำเครื่องหมายแต่ละรายการในหน่วยพิกเซล ค่าที่รองรับมีดังนี้ 12, 16, 24

<fill_color>

สีเติมของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<outline_color>

สีเติมขอบของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<spacing>

ขนาดระยะห่างระหว่างเครื่องหมายแต่ละตัวในกลุ่มข้อมูลในหน่วยพิกเซล

<alignment>

สตริงที่ไม่บังคับที่อธิบายการปรับแนวไอคอนและออฟเซ็ต

ตัวอย่าง

ตัวอย่างนี้ใช้ชุดข้อมูลจำลองชุดที่ 2 โดยไม่ได้แสดงในแผนภูมิ แต่เป็นวิธีเว้นระยะห่างของกองทั้งหมดให้เท่าๆ กัน โดยเริ่มจากด้านล่างของแผนภูมิ chd=s1:0akAZtnkmi,AAAAAAAAAA - ชุดแรกใช้เพื่อพล็อตเส้นและกำหนดความสูงของสแต็ก รายการที่ 2 จะใช้ระบุฐานของกองไอคอนแต่ละชุดที่ค่า 0 chem=y - แสดงไอคอนแบบไดนามิก s=cm_repeat - ใช้ไอคอนบริบทของรูปแบบการเรียงซ้อน ds=1 - แสดงรายการในชุดข้อมูล 1 dp=all - วางไอคอนในทุกจุด d= d=petrol - ใช้สัญลักษณ์น้ำมัน 0 - ใช้ชุดข้อมูล 0 สำหรับจำนวนการทำซ้ำ 9 - ใช้ตัวคูณมาตราส่วนเป็น 6 V - กองซ้อนแนวตั้ง 16 - ทำให้เครื่องหมายแต่ละรายการสูง 16 พิกเซล F00 - สีเติมของไอคอน 000 - สีขอบของไอคอน 2 - 2 พิกเซลระหว่างแต่ละไอคอนในกลุ่ม hb - จัดกองอยู่ด้านล่างไว้ตรงกลาง

chd=s1:0akAZtnkmi,AAAAAAAAAA chem=   y;s=cm_repeat;ds=1;dp=all;   d=petrol,0,9,V,16,F00,000,2,hb

กลับไปด้านบน

 




---

 

การซ้อนและรูปแบบสี (cm_repeat_color)

คุณสามารถเปลี่ยนแปลงทั้งความสูงและสีของกลุ่มไอคอน ตามค่าข้อมูลในจุดที่ระบุ

ไวยากรณ์

chem=y;s=cm_repeat_color;ds=<series_rendering_index>; ...other_values... ;
  d=<icon_shape>,<repeat_series_index>,<scaling_factor>,<stacking_direction>,<icon_size>,<color_data_series>,<low_color>,<middle_color>,<high_color>,<outline_color>,<spacing>,<alignment>

<icon_shape>

ไอคอนที่จะใช้ ระบุสตริงรหัสที่ระบุหนึ่งในรูปภาพที่แสดงอยู่ตอนท้ายของหน้าเว็บ

<repeat_series_index>

ดัชนีฐาน 0 ของชุดข้อมูลซึ่งใช้ในการคำนวณจำนวนไอคอนที่จะวางในจุดนี้

<scaling_factor>

ค่าชุดข้อมูลต้นฉบับจะมีการปรับขนาดเป็นค่าจาก 0 ถึง 1 แล้วคูณด้วยค่านี้เพื่อระบุจำนวนตัวทำเครื่องหมายที่จะวางในจุดนี้ ตัดค่าบางส่วนให้สั้นลง

<stacking_direction>

ทิศทางการซ้อน: "h" (ตัวพิมพ์เล็ก) สำหรับแนวนอน หรือ "V" (ตัวพิมพ์ใหญ่) สำหรับแนวตั้ง

<icon_size>

ขนาดของตัวทำเครื่องหมายแต่ละรายการในหน่วยพิกเซล ค่าที่รองรับมีดังนี้ 12, 16, 24

<color_data_series>

ดัชนีฐาน 0 ของชุดข้อมูลที่ใช้เพื่อทำให้สีของไอคอนแตกต่างกัน

<low_color>

ค่าสีระดับต่ำในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ซึ่งจะเชื่อมโยงกับค่าต่ำสุดที่เป็นไปได้ในช่วงข้อมูลที่มี

<middle_color>

ค่าสีตรงกลางในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ค่านี้เชื่อมโยงกับค่าตรงกลางในช่วงข้อมูลที่มี

<high_color>

ค่าสีระดับสูงในช่วง เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #) ซึ่งจะเชื่อมโยงกับค่าสูงสุดที่เป็นไปได้ในช่วงข้อมูลที่มี

<outline_color>

สีเติมขอบของไอคอน เป็นสีเลขฐานสิบหก HTML ที่มี 3 หรือ 6 หลัก (ไม่มีเครื่องหมาย #)

<spacing>

ขนาดระยะห่างระหว่างเครื่องหมายแต่ละตัวในกลุ่มข้อมูลในหน่วยพิกเซล

<alignment>

สตริงที่ไม่บังคับที่อธิบายการปรับแนวไอคอนและออฟเซ็ต

ตัวอย่าง

chem=y - แสดงไอคอนแบบไดนามิก s=cm_repeat_color - ใช้ไอคอนบริบทการซ้อนและรูปแบบสี ds=0 - แสดงรายการในชุดข้อมูล 0 dp=all - วางไอคอนในทุกจุด d= petrol - ใช้สัญลักษณ์น้ำมัน 0 - ใช้ชุดข้อมูล 0 สำหรับจำนวนการทำซ้ำ 6 - ใช้ตัวคูณมาตราส่วนเป็น 6 V - กองซ้อนแนวตั้ง 12 - ทำให้เครื่องหมายแต่ละเครื่องหมายสูง 12 พิกเซล 0 - ใช้อนุกรม 0 เพื่อระบุสี F00,0F0,00F - ค่าสีระดับต่ำ กลาง และสูง 000 - สีขอบของไอคอน 2 - 2 พิกเซลระหว่างแต่ละไอคอนในกลุ่ม hv - จัดกองอาหารไว้ตรงกลางจุดข้อมูลแต่ละจุดในแนวตั้งและแนวนอน

chem=   y;s=cm_repeat_color;ds=0;dp=all;   d=petrol,0,6,V,12,0,F00,0F0,00F,000,2,hv

กลับไปด้านบน