Layerpin logo
เริ่มสร้าง

เครื่องหมายกับรูปร่าง: การเลือกรายการแผนที่ที่เหมาะสม

เชี่ยวชาญการใช้พิน รูปหลายเหลี่ยม สี่เหลี่ยม เส้นหลายเส้น และป้ายกำกับอย่างมีกลยุทธ์ เพื่อสร้างแผนที่เชิงโต้ตอบที่สะอาดตาและใช้งานง่าย ซึ่งสื่อสารลำดับชั้นเชิงพื้นที่ได้อย่างง่ายดาย

LP

ทีม Layerpin

ใช้เวลาอ่าน 7 นาที
แผนที่พร้อมเครื่องหมายระบุตำแหน่งและขอบเขตพื้นที่ที่กำหนด

กฎหลัก: คะแนนสำหรับจุดหมายปลายทาง พื้นที่สำหรับอาณาเขต

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

ใช้ หมุดมาร์กเกอร์ เมื่อสถานที่นั้นเป็นจุดแยกจุดเดียว: ประตูทางเข้า ตู้ข้อมูล จุดชมวิว ชิ้นส่วนเครื่องจักร หรือโต๊ะเฉพาะ หมุดมาร์กเกอร์ตอบคำถาม: 'สิ่งนี้อยู่ที่ไหนกันแน่?'

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

  1. 1
    ประเมินว่าผู้เข้าชมจำเป็นต้องค้นหาพิกัดที่ระบุหรือเข้าใจพื้นที่ที่มีขอบเขต
  2. 2
    ตั้งค่าเริ่มต้นเป็นหมุดมาร์กเกอร์สำหรับจุดสนใจต่ำกว่า 5% ของพื้นที่วิวพอร์ต
  3. 3
    ค่าเริ่มต้นเป็นรูปหลายเหลี่ยมหรือสี่เหลี่ยมสำหรับห้อง อาคาร ที่ดิน และโซน

เมื่อใดจึงควรใช้ Polylines, Connectors และ Custom Lines

นอกเหนือจากหมุดและรูปร่างแล้ว Layerpin ยังมีเครื่องมือเส้นเวกเตอร์พิเศษ: Polylines, Arrows และ Callout Connectors

ใช้ เส้นโพลีไลน์ สำหรับคุณลักษณะเชิงเส้นต่อเนื่อง: เส้นทางเดินเท้า เส้นทางมาราธอน ท่อส่งสาธารณูปโภค เส้นทางทัวร์พร้อมไกด์ และเส้นทางการขนส่งสาธารณะ Polylines รองรับสไตล์เส้นขีดที่กำหนดเอง ขีดกลาง ลูกศร และการแก้ไขจุดยอดแบบหลายส่วน

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

  1. 1
    เลือกเครื่องมือ Polyline สำหรับเส้นทาง ขอบเขต เส้นทาง และช่องทางสาธารณูปโภค
  2. 2
    ใช้ตัวเชื่อมต่อคำบรรยายสำหรับพื้นที่ที่มีผู้คนหนาแน่นเพื่อชดเชยป้ายกำกับให้เรียบร้อย
  3. 3
    ปรับความหนาของเส้น (2px ถึง 6px) และรูปแบบเส้นประเพื่อแยกแยะประเภทเส้นทางที่แตกต่างกัน (เช่น เส้นทึบสำหรับทางเดินหลัก เส้นประสำหรับทางออกฉุกเฉิน)
แผนที่นำทางแบบโต้ตอบแสดงหมุดข้างเส้นเส้นทางและโซนรูปหลายเหลี่ยม

การควบคุมสไตล์ของรูปร่าง: ความทึบ เส้นขอบ และคอนทราสต์

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

ตั้งค่าความทึบในการเติมรูปร่างเริ่มต้นระหว่าง 15% ถึง 30% การล้างที่ละเอียดอ่อนนี้สร้างอาณาเขตในขณะที่ยังคงรักษารายละเอียดทางสถาปัตยกรรมให้อ่านได้ จับคู่กับเส้นขอบเส้นทึบขนาด 1.5px ถึง 2.5px ที่คมชัดในเฉดสีที่ตัดกัน

เมื่อโฮเวอร์และการเลือก ให้เพิ่มความทึบเป็น 40-50% และทำให้เส้นขอบหนาขึ้นเพื่อให้ข้อเสนอแนะเชิงโต้ตอบที่ชัดเจน Layerpin ช่วยให้คุณสามารถตั้งค่าโทเค็นสีที่กำหนดเองซึ่งสอดคล้องกับแนวทางแบรนด์ของคุณโดยตรง

  1. 1
    รักษาความทึบในการเติมฐานให้ต่ำ (15-25%) เพื่อให้แผนที่พื้นหลังยังคงมองเห็นได้ทั้งหมด
  2. 2
    ใช้สีเส้นขีดที่แตกต่างกันซึ่งปรากฏบนภาพพื้นหลังทั้งสีอ่อนและสีเข้ม
  3. 3
    กำหนดค่าโฮเวอร์ที่โดดเด่นและสถานะที่เลือกเพื่อการตอบรับแบบโต้ตอบที่ราบรื่น

ผสมผสานเครื่องหมายและรูปทรงเข้าด้วยกันอย่างกลมกลืน

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

สร้างกฎการโต้ตอบที่สอดคล้องกัน: หากการคลิกรูปหลายเหลี่ยมจะเปิดบัตรข้อมูลการเช่า การคลิกหมุดลูกที่อยู่ด้านในนั้นควรเปิดบัตรผู้ขายที่เฉพาะเจาะจง ตรวจสอบให้แน่ใจว่าหมุดลูกมีการซ้อนดัชนี z ไว้สูงกว่า เพื่อให้สามารถคลิกภายในขอบเขตรูปหลายเหลี่ยมได้อย่างง่ายดาย

ใช้แผงการจัดการเลเยอร์ของ Layerpin เพื่อจัดลำดับองค์ประกอบใหม่และล็อครูปร่างพื้นหลัง ป้องกันการคลิกผิดโดยไม่ตั้งใจระหว่างการแก้ไข

Layerpin logo

พร้อมสร้างแผนที่แบบโต้ตอบหรือยัง?

สร้างแผนที่แบบส่วนตัว ตรวจสอบมุมมองผู้เข้าชม แล้วเผยแพร่เมื่อพร้อมแบ่งปัน No credit card needed.

เริ่มต้นฟรี