มุมมองการวางซ้อนของ deck.gl
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
ดูตัวอย่าง
Deck.gl เป็นเฟรมเวิร์กการแสดงภาพที่ทำงานด้วย WebGL
ซึ่งมีการแสดงภาพข้อมูล 2 มิติและ 3 มิติที่ใช้งานง่ายหลากหลายรูปแบบ
พร้อมรองรับชุดข้อมูลขนาดใหญ่ คุณเพิ่มการแสดงข้อมูลด้วยภาพของ deck.gl ได้โดยใช้
Maps JavaScript API กับคลาส GoogleMapsOverlay ของ deck.gl
Deck.gl รองรับแหล่งข้อมูลและรูปแบบหลายรายการ รวมถึงการสร้าง
การแสดงข้อมูลแบบผสมโดยการแสดงผลเลเยอร์การแสดงข้อมูลหลายรายการบนแผนที่
ข้อกำหนด
หากต้องการใช้ deck.gl คุณต้องใช้แผนที่แบบแรสเตอร์หรือเวกเตอร์ที่จัดทำโดย Maps JavaScript API เราขอแนะนำอย่างยิ่งให้คุณใช้แผนที่เวกเตอร์เพื่อให้
ใช้ประโยชน์จากฟีเจอร์ที่ทำงานด้วย WebGL ของแผนที่ฐานของ Google ได้อย่างเต็มที่
ซึ่งรวมถึงการเอียง การหมุน และการควบคุมกล้อง 3 มิติอย่างเต็มรูปแบบ
ดูรายละเอียดได้ที่ภาพรวมแผนที่เวกเตอร์
กำลังโหลด deck.gl
คุณโหลด Deck.gl ในเว็บแอปได้โดยใช้แท็กสคริปต์ หรือติดตั้งเป็นโมดูลจาก Node Package Manager (NPM)
ดูข้อมูลเพิ่มเติมได้ที่เอกสารประกอบ@deck.gl/google-maps ในเว็บไซต์ deck.gl
การเพิ่มภาพข้อมูล deck.gl ลงในแผนที่
ระบบจะเพิ่มการแสดงข้อมูลด้วย Deck.gl ลงในแผนที่โดยการสร้างอินสแตนซ์ของคลาส GoogleMapsOverlay ที่จัดทำโดย deck.gl
ดูข้อมูลเพิ่มเติมได้ที่เอกสารประกอบของ GoogleMapsOverlay ในเว็บไซต์ deck.gl
การแสดงภาพที่ใช้ได้
Deck.gl มีการแสดงภาพ 2 มิติและ 3 มิติที่แตกต่างกันมากมายซึ่งได้รับการเพิ่มประสิทธิภาพเพื่อ
แสดงข้อมูลประเภทต่างๆ ดูรายการทั้งหมดได้ที่แคตตาล็อกเลเยอร์ในเว็บไซต์ deck.gl
ตัวอย่าง
ดูตัวอย่างเพิ่มเติมของ deck.gl และ Maps JavaScript API ที่ใช้งานจริงได้ที่
เนื้อหาของหน้าเว็บนี้ได้รับอนุญาตภายใต้ใบอนุญาตที่ต้องระบุที่มาของครีเอทีฟคอมมอนส์ 4.0 และตัวอย่างโค้ดได้รับอนุญาตภายใต้ใบอนุญาต Apache 2.0 เว้นแต่จะระบุไว้เป็นอย่างอื่น โปรดดูรายละเอียดที่นโยบายเว็บไซต์ Google Developers Java เป็นเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-08-27 UTC
[null,null,["อัปเดตล่าสุด 2025-08-27 UTC"],[[["\u003cp\u003eDeck.gl is a WebGL-powered visualization framework offering diverse 2D and 3D data visualizations, easily integrated with the Maps JavaScript API using its \u003ccode\u003eGoogleMapsOverlay\u003c/code\u003e class.\u003c/p\u003e\n"],["\u003cp\u003eIt supports various data sources and formats, enabling composite visualizations by layering multiple visualization types on the map, best utilized with the vector map for leveraging WebGL's 3D capabilities.\u003c/p\u003e\n"],["\u003cp\u003eDeck.gl can be integrated using a script tag or installed as modules from NPM, with detailed guidance available in the deck.gl documentation.\u003c/p\u003e\n"],["\u003cp\u003eNumerous 2D and 3D visualization options are provided by Deck.gl, optimized for different data types, as showcased in the Layer Catalog on the deck.gl website.\u003c/p\u003e\n"],["\u003cp\u003eExamples demonstrate the integration of Deck.gl and the Maps JavaScript API, including ArcLayer, Trips Layer, and ScatterPlot visualizations.\u003c/p\u003e\n"]]],[],null,["\u003cbr /\u003e\n\n\n[View Sample](/maps/documentation/javascript/examples/deckgl-tripslayer) \n\n[Deck.gl](https://deck.gl) is a WebGL-powered visualization\nframework that provides a variety of easy-to-use 2D and 3D data visualizations\nwith support for large data sets. You can add deck.gl data visualizations with\nthe Maps JavaScript API with deck.gl's [`GoogleMapsOverlay`](https://deck.gl/docs/api-reference/google-maps/google-maps-overlay) class.\n\nDeck.gl supports multiple datasources and formats, as well as creating\ncomposite visualizations by rendering multiple visualization layers on the map.\n\nRequirements\n\nTo use deck.gl you must use the raster or vector map provided by the Maps\nJavaScript API. It is highly recommended that you use the vector map so that\nyou can take full advantage of the WebGL-powered features of Google's basemap,\nincluding tilt, rotation, and full 3D camera control.\n\n[See the vector map overview for details](/maps/documentation/javascript/vector-map).\n\nLoading deck.gl\n\nDeck.gl can be loaded in your web app using either a script tag, or installed\nas modules from Node Package Manager (NPM).\n\nFor more information, see the [@deck.gl/google-maps documentation](https://deck.gl/docs/api-reference/google-maps/overview) on the deck.gl website.\n\nAdding deck.gl visualizations to the map\n\nDeck.gl visualizations are added to the map by creating an instance of the\n`GoogleMapsOverlay` class provided by deck.gl.\n\nFor more information, see the [`GoogleMapsOverlay` documentation](https://deck.gl/docs/api-reference/google-maps/google-maps-overlay) on the deck.gl website.\n\nAvailable visualizations\n\nDeck.gl provides many different 2D and 3D visualizations that are optimized for\ndisplaying different types of data. For a complete list, see the\n[Layer Catalog](https://deck.gl/docs/api-reference/layers) on the\ndeck.gl website.\n\nExamples\n\nSee more examples of deck.gl and Maps JavaScript API in action:\n\n- [Deck.gl ArcLayer](/maps/documentation/javascript/examples/deckgl-arclayer)\n- [Deck.gl HeatmpaLayer](/maps/documentation/javascript/examples/deckgl-heatmap)\n- [Deck.gl Trips Layer](/maps/documentation/javascript/examples/deckgl-tripslayer)\n- [Deck.gl ScatterPlot](/maps/documentation/javascript/examples/deckgl-points)"]]
