บริการลิฟต์

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

ภาพรวม

บริการระดับความสูงให้ข้อมูลระดับความสูงของ ตําแหน่งบนพื้นผิวโลก รวมถึงตําแหน่งความลึกในก้นมหาสมุทร (ซึ่งแสดงค่าลบ) ในกรณีที่ Google ไม่ได้วัดความสูงที่แน่นอน ณ ตําแหน่งที่แน่นอนที่คุณขอ บริการจะประมาณค่าและแสดงผลค่าเฉลี่ยโดยใช้ตําแหน่งที่ใกล้ที่สุด 4 ตําแหน่ง

ออบเจ็กต์ ElevationService มอบอินเทอร์เฟซง่ายๆ ไว้สําหรับการค้นหาตําแหน่งใน Earth สําหรับข้อมูลระดับความสูง นอกจากนี้ คุณอาจขอข้อมูลระดับความสูงจากการสุ่มตัวอย่างตลอดเส้นทาง ซึ่งช่วยให้คํานวณการเปลี่ยนแปลงระดับความสูงของความเสมอภาคตลอดเส้นทางได้ ออบเจ็กต์ ElevationService สื่อสารกับบริการยกระดับ Google Maps API ซึ่งจะได้รับ คําขอระดับความสูงและส่งคืนข้อมูลระดับความสูง

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

เริ่มต้นใช้งาน

ก่อนที่จะใช้บริการระดับความสูงใน Maps JavaScript API ให้ เปิดใช้ Elevation API ใน Google Cloud Console ในโปรเจ็กต์เดียวกันกับที่ตั้งค่าไว้สําหรับ Maps JavaScript API

วิธีดูรายการ API ที่เปิดใช้

  1. ไปที่ Google Cloud Console
  2. คลิกปุ่มเลือกโปรเจ็กต์ แล้วเลือกโปรเจ็กต์เดียวกับที่คุณตั้งค่าไว้สําหรับ Maps JavaScript API แล้วคลิกเปิด
  3. ค้นหา Elevation API จากรายการ API ในหน้าแดชบอร์ด
  4. หากเห็น API ในรายการ นั่นหมายความว่าทุกอย่างพร้อมแล้ว หากไม่อยู่ในรายการ API ให้เปิดใช้โดยทําดังนี้
    1. ที่ด้านบนของหน้า ให้เลือกเปิดใช้ API เพื่อแสดงแท็บไลบรารี หรือเลือกคลังจากเมนูด้านซ้าย
    2. ค้นหา Elevation API แล้วเลือกจากรายการผลการค้นหา
    3. เลือกเปิดใช้ เมื่อเสร็จสิ้นกระบวนการ Elevation API จะปรากฏในรายการ API ในหน้าแดชบอร์ด

ราคาและนโยบาย

ฝ่ายกำหนดราคา

ตั้งแต่วันที่ 16 กรกฎาคม 2018 เป็นต้นไป แผนการตั้งราคาแบบจ่ายเมื่อใช้แบบใหม่จะมีผลสําหรับ Maps, Routes และ Places ดูข้อมูลเพิ่มเติมเกี่ยวกับราคาและขีดจํากัดการใช้งานใหม่สําหรับบริการ JavaScript Elevation ได้ที่การใช้งานและการเรียกเก็บเงินสําหรับ Elevation API

ขีดจำกัดอัตรา

โปรดทราบข้อมูลต่อไปนี้เกี่ยวกับขีดจํากัดอัตราคําขอเพิ่มเติม

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

ขีดจํากัดอัตราต่อเซสชันจะป้องกันการใช้บริการฝั่งไคลเอ็นต์สําหรับคําขอแบบกลุ่ม แต่หากคุณต้องการคํานวณระดับความสูงสําหรับสถานที่คงที่ที่รู้จัก ให้ใช้บริการเว็บ Elevation API แทน

นโยบาย

การใช้บริการระดับความสูงต้องเป็นไปตามนโยบายที่อธิบายสําหรับ Elevation API

คําขอระดับความสูง

การเข้าถึงบริการยกระดับไม่พร้อมกัน เนื่องจาก Google Maps API ต้องเรียกไปยังเซิร์ฟเวอร์ภายนอก ด้วยเหตุนี้ คุณจึงต้องส่งเมธอด backback (คําขอเรียกกลับ) เพื่อดําเนินการตามคําขอให้เสร็จสมบูรณ์ วิธีการโทรกลับนี้ควรประมวลผลผลลัพธ์ โปรดทราบว่าบริการระดับความสูงจะแสดงรหัสสถานะ (ElevationStatus) และอาร์เรย์ของออบเจ็กต์ ElevationResult แยกต่างหาก

ElevationService จัดการคําขอ 2 ประเภทต่อไปนี้

  • คําขอสําหรับตําแหน่งที่แยกจากกันและแยกกันโดยใช้เมธอด getElevationForLocations() ซึ่งส่งรายการตําแหน่งอย่างน้อย 1 รายการโดยใช้ออบเจ็กต์ LocationElevationRequest
  • คําขอระดับความสูงของชุดจุดที่เชื่อมต่อระหว่างเส้นทางโดยใช้เมธอด getElevationAlongPath() ซึ่งผ่านชุดจุดเปลี่ยนเส้นทางตามลําดับภายในออบเจ็กต์ PathElevationRequest เมื่อขอระดับความสูงตามเส้นทาง คุณต้องส่งพารามิเตอร์ที่ระบุจํานวนตัวอย่างที่ต้องการใช้ตลอดเส้นทางนั้นด้วย

แต่ละวิธีเหล่านี้จะต้องผ่านเมธอด backback เพื่อจัดการออบเจ็กต์ ElevationResult และ ElevationStatus ที่แสดงผลด้วย

คําขอระดับความสูงของสถานที่ตั้ง

เอลิเมนต์ของออบเจ็กต์ LocationElevationRequest มีช่องต่อไปนี้

{
  locations[]: LatLng
}

locations (ต้องระบุ) กําหนดตําแหน่งบนพื้นโลกซึ่งแสดงข้อมูลระดับความสูง พารามิเตอร์นี้ใช้อาร์เรย์ของ LatLng

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

คําขอระดับความสูงของเส้นทางตัวอย่าง

เอลิเมนต์ของออบเจ็กต์ PathElevationRequest มีช่องต่อไปนี้

{
  path[]: LatLng,
  samples: Number
}

โปรดดูคําอธิบายช่องต่อไปนี้

  • path (ต้องระบุ) กําหนดเส้นทางบนพื้นโลกซึ่งแสดงข้อมูลระดับความสูง พารามิเตอร์ path กําหนดชุดคู่ {ละติจูด,ลองจิจูด} ที่เรียงลําดับอย่างน้อย 2 คู่โดยใช้อาร์เรย์ของออบเจ็กต์ LatLng อย่างน้อย 2 รายการ
  • samples (ต้องระบุ) ระบุจํานวนจุดตัวอย่างตลอดเส้นทางที่จะแสดงข้อมูลระดับความสูง พารามิเตอร์ samples จะแบ่ง path ที่ระบุออกเป็นชุดจุดที่มีค่าตามลําดับในเส้นทาง

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

การตอบสนองระดับความสูง

สําหรับคําขอที่ถูกต้องแต่ละคําขอ บริการระดับความสูงจะกลับไปใช้ Callback ของชุดออบเจ็กต์ ElevationResult ที่ระบุพร้อมกับออบเจ็กต์ ElevationStatus

สถานะระดับความสูง

คําขอยกระดับแต่ละรายการจะแสดงรหัส ElevationStatus ภายในฟังก์ชันเรียกกลับ รหัส status นี้จะมีค่าใดค่าหนึ่งต่อไปนี้

  • OK หมายความว่าคําขอบริการสําเร็จ
  • INVALID_REQUEST ที่บ่งบอกว่าคําขอบริการมีรูปแบบไม่ถูกต้อง
  • OVER_QUERY_LIMIT ระบุว่าผู้ขอ เกินโควต้า
  • REQUEST_DENIED ระบุว่าบริการไม่เสร็จสมบูรณ์ อาจเป็นเพราะพารามิเตอร์ไม่ถูกต้อง
  • UNKNOWN_ERROR บ่งบอกถึงข้อผิดพลาดที่ไม่ทราบสาเหตุ

คุณควรตรวจสอบว่าการเรียกกลับประสบความสําเร็จด้วยการตรวจสอบรหัสสถานะนี้สําหรับ OK

ผลลัพธ์ของระดับความสูง

หากสําเร็จ อาร์กิวเมนต์ results ของฟังก์ชันเรียกกลับจะมีชุดออบเจ็กต์ ElevationResult ออบเจ็กต์เหล่านี้มีองค์ประกอบต่อไปนี้

  • องค์ประกอบ location (มีออบเจ็กต์ LatLng) ของตําแหน่งที่มีการคํานวณข้อมูลระดับความสูง โปรดทราบว่าสําหรับคําขอเส้นทาง ชุดขององค์ประกอบ location จะมีจุดตัวอย่างตลอดเส้นทาง
  • องค์ประกอบ elevation ที่ระบุระดับความสูงของสถานที่เป็นหน่วยเมตร
  • ค่า resolution ซึ่งระบุระยะทางสูงสุดระหว่างจุดข้อมูลที่มีการยกระดับระดับความสูงเป็นหน่วยเมตร พร็อพเพอร์ตี้นี้จะหายไปหากไม่ทราบวิธีแก้ไขปัญหา โปรดทราบว่าข้อมูลระดับความสูงจะหยาบมากขึ้น (ค่า resolution ใหญ่ขึ้น) เมื่อผ่านหลายจุด หากต้องการหาค่าระดับความสูงที่แม่นยําที่สุดสําหรับจุดใดจุดหนึ่ง ควรให้มีการค้นหาค่าขึ้นมาเองโดยอิสระ

ตัวอย่างระดับความสูง

โค้ดต่อไปนี้จะแปลการคลิกบนแผนที่เป็นคําขอระดับความสูงโดยใช้ออบเจ็กต์ LocationElevationRequest

TypeScript

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 8,
      center: { lat: 63.333, lng: -150.5 }, // Denali.
      mapTypeId: "terrain",
    }
  );
  const elevator = new google.maps.ElevationService();
  const infowindow = new google.maps.InfoWindow({});

  infowindow.open(map);

  // Add a listener for the click event. Display the elevation for the LatLng of
  // the click inside the infowindow.
  map.addListener("click", (event) => {
    displayLocationElevation(event.latLng, elevator, infowindow);
  });
}

function displayLocationElevation(
  location: google.maps.LatLng,
  elevator: google.maps.ElevationService,
  infowindow: google.maps.InfoWindow
) {
  // Initiate the location request
  elevator
    .getElevationForLocations({
      locations: [location],
    })
    .then(({ results }) => {
      infowindow.setPosition(location);

      // Retrieve the first result
      if (results[0]) {
        // Open the infowindow indicating the elevation at the clicked position.
        infowindow.setContent(
          "The elevation at this point <br>is " +
            results[0].elevation +
            " meters."
        );
      } else {
        infowindow.setContent("No results found");
      }
    })
    .catch((e) =>
      infowindow.setContent("Elevation service failed due to: " + e)
    );
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 8,
    center: { lat: 63.333, lng: -150.5 },
    mapTypeId: "terrain",
  });
  const elevator = new google.maps.ElevationService();
  const infowindow = new google.maps.InfoWindow({});

  infowindow.open(map);
  // Add a listener for the click event. Display the elevation for the LatLng of
  // the click inside the infowindow.
  map.addListener("click", (event) => {
    displayLocationElevation(event.latLng, elevator, infowindow);
  });
}

function displayLocationElevation(location, elevator, infowindow) {
  // Initiate the location request
  elevator
    .getElevationForLocations({
      locations: [location],
    })
    .then(({ results }) => {
      infowindow.setPosition(location);
      // Retrieve the first result
      if (results[0]) {
        // Open the infowindow indicating the elevation at the clicked position.
        infowindow.setContent(
          "The elevation at this point <br>is " +
            results[0].elevation +
            " meters."
        );
      } else {
        infowindow.setContent("No results found");
      }
    })
    .catch((e) =>
      infowindow.setContent("Elevation service failed due to: " + e)
    );
}

window.initMap = initMap;
ดูตัวอย่าง

ลองใช้ตัวอย่าง

ตัวอย่างต่อไปนี้สร้างเส้นประกอบที่ระบุชุดพิกัดและแสดงข้อมูลระดับความสูงตามเส้นทางนั้นโดยใช้ GoogleVisual API (คุณต้องโหลด API นี้โดยใช้ตัวโหลดทั่วไปของ Google) คําขอยกระดับสร้างขึ้นโดยใช้ PathElevationRequest ดังนี้

TypeScript

// Load the Visualization API and the columnchart package.
// @ts-ignore TODO update to newest visualization library
google.load("visualization", "1", { packages: ["columnchart"] });

function initMap(): void {
  // The following path marks a path from Mt. Whitney, the highest point in the
  // continental United States to Badwater, Death Valley, the lowest point.
  const path = [
    { lat: 36.579, lng: -118.292 }, // Mt. Whitney
    { lat: 36.606, lng: -118.0638 }, // Lone Pine
    { lat: 36.433, lng: -117.951 }, // Owens Lake
    { lat: 36.588, lng: -116.943 }, // Beatty Junction
    { lat: 36.34, lng: -117.468 }, // Panama Mint Springs
    { lat: 36.24, lng: -116.832 },
  ]; // Badwater, Death Valley

  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 8,
      center: path[1],
      mapTypeId: "terrain",
    }
  );

  // Create an ElevationService.
  const elevator = new google.maps.ElevationService();

  // Draw the path, using the Visualization API and the Elevation service.
  displayPathElevation(path, elevator, map);
}

function displayPathElevation(
  path: google.maps.LatLngLiteral[],
  elevator: google.maps.ElevationService,
  map: google.maps.Map
) {
  // Display a polyline of the elevation path.
  new google.maps.Polyline({
    path: path,
    strokeColor: "#0000CC",
    strokeOpacity: 0.4,
    map: map,
  });

  // Create a PathElevationRequest object using this array.
  // Ask for 256 samples along that path.
  // Initiate the path request.
  elevator
    .getElevationAlongPath({
      path: path,
      samples: 256,
    })
    .then(plotElevation)
    .catch((e) => {
      const chartDiv = document.getElementById(
        "elevation_chart"
      ) as HTMLElement;

      // Show the error code inside the chartDiv.
      chartDiv.innerHTML = "Cannot show elevation: request failed because " + e;
    });
}

// Takes an array of ElevationResult objects, draws the path on the map
// and plots the elevation profile on a Visualization API ColumnChart.
function plotElevation({ results }: google.maps.PathElevationResponse) {
  const chartDiv = document.getElementById("elevation_chart") as HTMLElement;

  // Create a new chart in the elevation_chart DIV.
  const chart = new google.visualization.ColumnChart(chartDiv);

  // Extract the data from which to populate the chart.
  // Because the samples are equidistant, the 'Sample'
  // column here does double duty as distance along the
  // X axis.
  const data = new google.visualization.DataTable();

  data.addColumn("string", "Sample");
  data.addColumn("number", "Elevation");

  for (let i = 0; i < results.length; i++) {
    data.addRow(["", results[i].elevation]);
  }

  // Draw the chart using the data within its DIV.
  chart.draw(data, {
    height: 150,
    legend: "none",
    // @ts-ignore TODO update to newest visualization library
    titleY: "Elevation (m)",
  });
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

// Load the Visualization API and the columnchart package.
// @ts-ignore TODO update to newest visualization library
google.load("visualization", "1", { packages: ["columnchart"] });

function initMap() {
  // The following path marks a path from Mt. Whitney, the highest point in the
  // continental United States to Badwater, Death Valley, the lowest point.
  const path = [
    { lat: 36.579, lng: -118.292 },
    { lat: 36.606, lng: -118.0638 },
    { lat: 36.433, lng: -117.951 },
    { lat: 36.588, lng: -116.943 },
    { lat: 36.34, lng: -117.468 },
    { lat: 36.24, lng: -116.832 },
  ]; // Badwater, Death Valley
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 8,
    center: path[1],
    mapTypeId: "terrain",
  });
  // Create an ElevationService.
  const elevator = new google.maps.ElevationService();

  // Draw the path, using the Visualization API and the Elevation service.
  displayPathElevation(path, elevator, map);
}

function displayPathElevation(path, elevator, map) {
  // Display a polyline of the elevation path.
  new google.maps.Polyline({
    path: path,
    strokeColor: "#0000CC",
    strokeOpacity: 0.4,
    map: map,
  });
  // Create a PathElevationRequest object using this array.
  // Ask for 256 samples along that path.
  // Initiate the path request.
  elevator
    .getElevationAlongPath({
      path: path,
      samples: 256,
    })
    .then(plotElevation)
    .catch((e) => {
      const chartDiv = document.getElementById("elevation_chart");

      // Show the error code inside the chartDiv.
      chartDiv.innerHTML = "Cannot show elevation: request failed because " + e;
    });
}

// Takes an array of ElevationResult objects, draws the path on the map
// and plots the elevation profile on a Visualization API ColumnChart.
function plotElevation({ results }) {
  const chartDiv = document.getElementById("elevation_chart");
  // Create a new chart in the elevation_chart DIV.
  const chart = new google.visualization.ColumnChart(chartDiv);
  // Extract the data from which to populate the chart.
  // Because the samples are equidistant, the 'Sample'
  // column here does double duty as distance along the
  // X axis.
  const data = new google.visualization.DataTable();

  data.addColumn("string", "Sample");
  data.addColumn("number", "Elevation");

  for (let i = 0; i < results.length; i++) {
    data.addRow(["", results[i].elevation]);
  }

  // Draw the chart using the data within its DIV.
  chart.draw(data, {
    height: 150,
    legend: "none",
    // @ts-ignore TODO update to newest visualization library
    titleY: "Elevation (m)",
  });
}

window.initMap = initMap;
ดูตัวอย่าง

ลองใช้ตัวอย่าง