นโยบายสำหรับ Maps JavaScript API

หัวข้อนี้ระบุข้อกำหนดในการระบุแหล่งที่มาสำหรับแอปพลิเคชันทั้งหมดที่พัฒนาด้วย Maps JavaScript API รวมถึงบริการเติมข้อความอัตโนมัติที่เป็นส่วนหนึ่งของ API ดังกล่าว ดูข้อกำหนดเพิ่มเติมของ Google Maps Platform ได้ที่ข้อกำหนดในการให้บริการของ Google Maps Platform

การระบุข้อกำหนดในการใช้งานและนโยบายความเป็นส่วนตัว

หากพัฒนาแอปพลิเคชัน Maps JavaScript API คุณต้องจัดทำข้อกำหนดในการใช้งานและนโยบายความเป็นส่วนตัวไว้กับแอปพลิเคชันของคุณ ซึ่งเป็นไปตามหลักเกณฑ์ที่ระบุไว้ในข้อตกลงระหว่างคุณกับ Google

• ข้อกำหนดในการใช้งานและนโยบายความเป็นส่วนตัวต้องเปิดเผยต่อสาธารณะ
• คุณต้องระบุอย่างชัดแจ้งในข้อกำหนดในการใช้งานของแอปพลิเคชันว่า เมื่อใช้แอปพลิเคชันแล้ว ผู้ใช้จะต้องปฏิบัติตามข้อกำหนดในการให้บริการของ Google
• คุณต้องแจ้งให้ผู้ใช้ทราบในนโยบายความเป็นส่วนตัวว่ากําลังใช้ Google Maps API และผสานรวมโดยอ้างอิงนโยบายความเป็นส่วนตัวของ Google

ตำแหน่งที่แนะนำในการแสดงข้อกำหนดในการใช้งานและนโยบายความเป็นส่วนตัวจะขึ้นอยู่กับแพลตฟอร์มของแอปพลิเคชัน

แอปพลิเคชันบนอุปกรณ์เคลื่อนที่

หากคุณพัฒนาแอปบนอุปกรณ์เคลื่อนที่ ขอแนะนำให้ระบุลิงก์ไปยังข้อกำหนดในการใช้งานและนโยบายความเป็นส่วนตัวบนหน้าดาวน์โหลดของแอปพลิเคชันใน App Store ที่เกี่ยวข้องและในเมนูการตั้งค่าแอปพลิเคชัน

เว็บแอปพลิเคชัน

หากคุณพัฒนาเว็บแอปพลิเคชัน เราขอแนะนำให้ระบุลิงก์ไปยังข้อกำหนดในการใช้งานและนโยบายความเป็นส่วนตัวในส่วนท้ายของเว็บไซต์

การดึงข้อมูล การแคช หรือการจัดเก็บเนื้อหาล่วงหน้า

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

โปรดทราบว่ารหัสสถานที่ที่ใช้เพื่อระบุสถานที่โดยไม่ซ้ำกันจะได้รับการยกเว้นข้อจำกัดการแคช ระบบจะแสดงรหัสสถานที่ในช่อง "place_id" ในการตอบสนองของ Maps JavaScript API ดูวิธีบันทึก รีเฟรช และจัดการรหัสสถานที่ในคู่มือรหัสสถานที่

การแสดงผล Maps JavaScript API

คุณสามารถแสดงผล Maps JavaScript API บน Google Maps หรือโดยไม่มีแผนที่ได้ หากต้องการแสดงผลลัพธ์ของ Maps JavaScript API บนแผนที่ ผลลัพธ์ดังกล่าวจะต้องแสดงบน Google Maps ไม่อนุญาตให้ใช้ข้อมูล Maps JavaScript API ในแผนที่ที่ไม่ใช่ Google Maps

การแสดงโลโก้ Google และการระบุแหล่งที่มา

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

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

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

สำหรับใช้กับพื้นหลังสีอ่อน	สำหรับใช้งานบนพื้นหลังสีเข้ม

ไฟล์ ZIP ต่อไปนี้มีโลโก้ Google ในขนาดที่ถูกต้องสำหรับแอปพลิเคชันในเดสก์ท็อป, Android และ iOS คุณต้องไม่ปรับขนาดหรือแก้ไขโลโก้ ไม่ว่าด้วยวิธีใด

ดาวน์โหลด: google_logo.zip

อย่าแก้ไขการระบุแหล่งที่มา ห้ามนำออก ปิดบัง หรือครอบตัดข้อมูลการระบุแหล่งที่มา คุณจะใช้โลโก้ Google ในบรรทัดไม่ได้ (เช่น "แผนที่เหล่านี้มาจาก [Google_logo]")

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

รวมผู้ให้บริการข้อมูลบุคคลที่สาม ข้อมูลและรูปภาพบางส่วนในผลิตภัณฑ์แผนที่ของเรามาจากผู้ให้บริการอื่นที่ไม่ใช่ Google หากใช้ภาพดังกล่าว ข้อความที่แสดงที่มาจะต้องระบุชื่อ "Google" และผู้ให้บริการข้อมูลที่เกี่ยวข้อง เช่น "ข้อมูลแผนที่: Google, Maxar Technologies" ในกรณีที่มีการอ้างอิงผู้ให้บริการข้อมูลบุคคลที่สาม พร้อมกับภาพ ให้ใส่เพียง "Google" เท่านั้นหรือการแสดงโลโก้ของ Google เป็นไปอย่างไม่ถูกต้อง

หากคุณใช้ Google Maps Platform ในอุปกรณ์ที่การแสดงที่มาใช้งานไม่ได้ โปรด ติดต่อทีมฝ่ายขายของ Google เพื่อหารือเรื่องใบอนุญาตที่เหมาะสมกับกรณีการใช้งานของคุณ

ข้อกำหนดอื่นๆ ในการระบุแหล่งที่มา

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

รีวิวและรูปภาพที่ให้ไว้ผ่าน Maps JavaScript API จะขึ้นอยู่กับนโยบายเนื้อหาและผลิตภัณฑ์ของ Google ไม่ว่าคุณจะอยู่ที่ใดในโลก หากต้องการรายงานเนื้อหาที่คุณหรือผู้ใช้ต้องการให้นำออกจากบริการของ Google ภายใต้นโยบายของ Google หรือกฎหมายที่เกี่ยวข้อง โปรดดูรายงานเนื้อหาใน Google

ดึงข้อมูลแหล่งที่มาจากสถานที่

หากแอปแสดงข้อมูลรีวิวที่ได้รับจากการเรียก Place.fetchFields แอปต้องแสดงการระบุแหล่งที่มาของบุคคลที่สามสำหรับรายละเอียดของสถานที่ที่ได้รับด้วย

API จะแสดงผลออบเจ็กต์ Place หากต้องการเรียกข้อมูลการระบุแหล่งที่มาจากออบเจ็กต์ Place ให้ใช้พร็อพเพอร์ตี้ Place.attributions ซึ่งแสดงผลพร้อมกับคำขอทั้งหมด (ไม่จำเป็นต้องระบุด้วยช่อง) พร็อพเพอร์ตี้จะแสดงผลListของออบเจ็กต์ String หรือ null หากไม่มีแอตทริบิวต์ที่จะแสดง โค้ดตัวอย่างต่อไปนี้แสดงการรับสถานที่และแสดงรายการการระบุแหล่งที่มา

  // Use place ID to create a new Place instance.
  const place = new Place({
      id: 'ChIJB9a4Ifl744kRlpz0BQJzGQ8', // Crazy Good Kitchen
  });

  // Call fetchFields, passing the desired data fields.
  await place.fetchFields({
      fields: ["displayName", "formattedAddress", "location", "reviews"],
  });

  // Check for any place attributions.
  if (!place.attributions) {
      console.log('No attributions were found.');
      return;
  } else {
      // Log the place attribution
      for (var attribution of place.attributions) {
          console.log(attribution);
      }
  }

  

แสดงรีวิว

ออบเจ็กต์ Place มีรีวิวได้สูงสุด 5 รายการ โดยรีวิวแต่ละรายการแสดงด้วยออบเจ็กต์ Review คุณสามารถเลือกแสดงรีวิวเหล่านี้ในแอปได้

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

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

  // Use place ID to create a new Place instance.
  const place = new Place({
      id: 'ChIJB9a4Ifl744kRlpz0BQJzGQ8', // Crazy Good Kitchen, Boston MA
  });

  // Call fetchFields, passing "reviews" and other needed fields.
  await place.fetchFields({
      fields: ["displayName", "formattedAddress", "location", "reviews"],
  });

  // If there are any reviews display the first one.
  if (!place.reviews) {
      console.log('No reviews were found.');
  } else {
      // Log the review count so we can see how many there are.
      console.log("REVIEW COUNT: " + place.reviews.length);

      // Get info for the first review.
      let reviewRating = place.reviews[0].rating;
      let reviewText = place.reviews[0].text;
      let authorName = place.reviews[0].authorAttribution.displayName;
      let authorUri = place.reviews[0].authorAttribution.uri;

      // Create a bit of HTML to add to the info window
      const contentString =
        '<div id="title"><b>' + place.displayName + '</b></div>' +
        '<div id="address">' + place.formattedAddress + '</div>' +
        '<a href="' + authorUri + '" target="_blank">Author: ' + authorName + '</a>' +
        '<div id="rating">Rating: ' + reviewRating + ' stars</div>' +
        '<div id="rating""><p>Review: ' + reviewText + '</p></div>';

      // Create an info window.
      infoWindow = new InfoWindow({
          content: contentString,
          ariaLabel: place.displayName,
      });

      // Add a marker for the place.
      const marker = new AdvancedMarkerElement({
          map,
          position: place.location,
          title: place.displayName,
      });

      // Show the info window.
      infoWindow.open({
          anchor: marker,
          map,
      });
  }
  

แสดงที่มาของรูปภาพ

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

องค์ประกอบแต่ละรายการของอาร์เรย์รูปภาพคืออินสแตนซ์ของ Photo ซึ่งมีอาร์เรย์ authorAttributions ประเภท AuthorAttribution ช่องของออบเจ็กต์ AuthorAttribution เป็นสตริงที่มี displayName, uri และ photoUri ของการระบุแหล่งที่มา หรือเป็นสตริงว่างหากไม่มีแอตทริบิวต์ที่จะแสดง

หลักเกณฑ์รูปแบบสําหรับการระบุแหล่งที่มาของ Google

ต่อไปนี้เป็นหลักเกณฑ์ด้านสไตล์สำหรับการระบุแหล่งที่มาของ Google ใน CSS และ HTML หากคุณใช้โลโก้ Google ที่ดาวน์โหลดได้

พื้นที่ว่าง

พื้นที่ว่างรอบโลโก้ตัวเต็มควรเท่ากับหรือมากกว่าความสูงของ "G" ใน Google

ช่องว่างระหว่างข้อความระบุแหล่งที่มาและโลโก้ Google ควรเท่ากับความกว้างตัว "G" ครึ่งหนึ่ง

อ่านง่าย

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

สี

ใช้ข้อความ Google Material Gray 700 บนพื้นหลังสีขาวหรือสีอ่อนที่ใช้โทนสีดำที่มีความเข้มสูงสุด 0%–40%

Google

#5F6368
RGB 95 99 104
HSL 213 5 39
HSB 213 9 41

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

Google

#FFFFFF
RGB 255 255 255
HSL 0 0 100
HSB 0 0 100

แบบอักษร

ใช้แบบอักษร Roboto

CSS ตัวอย่าง

เมื่อใช้ CSS ต่อไปนี้กับข้อความ "Google" จะแสดงผล "Google" ที่มีแบบอักษร สี และระยะห่างที่เหมาะสมบนพื้นหลังสีขาวหรือสีอ่อน

font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 16px;
padding: 16px;
letter-spacing: 0.0575em; /* 0.69px */
color: #5F6368;