Ringkasan yang Didukung AI

Lihat contoh kode sumber yang lengkap

Telusuri tempat untuk melihat ringkasan yang didukung AI. Beberapa penelusuran yang disarankan:

• "Hotel" untuk ringkasan kawasan.
• "Stasiun pengisian kendaraan listrik" untuk ringkasan fasilitas SPKLU.
• Restoran atau bisnis mana pun untuk ringkasan tempat dan ulasan.

TypeScript

// Define DOM elements.
const mapElement = document.querySelector('gmp-map') as google.maps.MapElement;
const placeAutocomplete = document.querySelector(
    'gmp-place-autocomplete'
) as google.maps.places.PlaceAutocompleteElement;
const summaryPanel = document.getElementById('summary-panel') as HTMLDivElement;
const placeName = document.getElementById('place-name') as HTMLElement;
const placeAddress = document.getElementById('place-address') as HTMLElement;
const tabContainer = document.getElementById('tab-container') as HTMLDivElement;
const summaryContent = document.getElementById(
    'summary-content'
) as HTMLDivElement;
const aiDisclosure = document.getElementById('ai-disclosure') as HTMLDivElement;
const flagContentLink = document.getElementById('flag-content-link') as HTMLAnchorElement;

let innerMap;
let marker: google.maps.marker.AdvancedMarkerElement;

async function initMap(): Promise<void> {
    // Request needed libraries.
    const [] = await Promise.all([
        google.maps.importLibrary('marker'),
        google.maps.importLibrary('places'),
    ]);

    innerMap = mapElement.innerMap;
    innerMap.setOptions({
        mapTypeControl: false,
        streetViewControl: false,
        fullscreenControl: false,
    });

    // Bind autocomplete bounds to map bounds.
    google.maps.event.addListener(innerMap, 'bounds_changed', async () => {
        placeAutocomplete.locationRestriction = innerMap.getBounds();
    });

    // Create the marker.
    marker = new google.maps.marker.AdvancedMarkerElement({
        map: innerMap,
    });

    // Handle selection of an autocomplete result.
    // prettier-ignore
    // @ts-ignore
    placeAutocomplete.addEventListener('gmp-select', async ({ placePrediction }) => {
            const place = placePrediction.toPlace();

            // Fetch all summary fields.
            await place.fetchFields({
                fields: [
                    'displayName',
                    'formattedAddress',
                    'location',
                    'generativeSummary',
                    'neighborhoodSummary',
                    'reviewSummary',
                    'evChargeAmenitySummary',
                ],
            });

            // Update the map viewport and position the marker.
            if (place.viewport) {
                innerMap.fitBounds(place.viewport);
            } else {
                innerMap.setCenter(place.location);
                innerMap.setZoom(17);
            }
            marker.position = place.location;

            // Update the panel UI.
            updateSummaryPanel(place);
        }
    );
}

function updateSummaryPanel(place: google.maps.places.Place) {
    // Reset UI
    summaryPanel.classList.remove('hidden');
    tabContainer.innerHTML = ''; // innerHTML is OK here since we're clearing known child elements.
    summaryContent.textContent = '';
    aiDisclosure.textContent = '';

    placeName.textContent = place.displayName || '';
    placeAddress.textContent = place.formattedAddress || '';

    let firstTabActivated = false;

    /**
     * Safe Helper: Accepts either a text string or a DOM Node (like a div or DocumentFragment).
     */
    const createTab = (
        label: string,
        content: string | Node,
        disclosure: string,
        flagUrl: string
    ) => {
        const btn = document.createElement('button');
        btn.className = 'tab-button';
        btn.textContent = label;

        btn.onclick = () => {
            // Do nothing if the tab is already active.
            if (btn.classList.contains('active')) {
                return;
            }

            // Manage the active class state.
            document
                .querySelectorAll('.tab-button')
                .forEach((b) => b.classList.remove('active'));
            btn.classList.add('active');

            if (typeof content === 'string') {
                summaryContent.textContent = content;
            } else {
                summaryContent.replaceChildren(content.cloneNode(true));
            }

            // Set the disclosure text.
            aiDisclosure.textContent = disclosure || 'AI-generated content.';

            // Add the content flag URI.
            if (flagUrl) {
                flagContentLink.href = flagUrl;
                flagContentLink.textContent = "Report an issue"
            }
        };

        tabContainer.appendChild(btn);

        // Auto-select the first available summary.
        if (!firstTabActivated) {
            btn.click();
            firstTabActivated = true;
        }
    };

    // --- 1. Generative Summary (Place) ---
    //@ts-ignore
    if (place.generativeSummary?.overview) {
        createTab(
            'Overview',
            //@ts-ignore
            place.generativeSummary.overview,
            //@ts-ignore
            place.generativeSummary.disclosureText,
            //@ts-ignore
            place.generativeSummary.flagContentURI
        );
    }

    // --- 2. Review Summary ---
    //@ts-ignore
    if (place.reviewSummary?.text) {
        createTab(
            'Reviews',
            //@ts-ignore
            place.reviewSummary.text,
            //@ts-ignore
            place.reviewSummary.disclosureText,
            //@ts-ignore
            place.reviewSummary.flagContentURI
        );
    }

    // --- 3. Neighborhood Summary ---
    //@ts-ignore
    if (place.neighborhoodSummary?.overview?.content) {
        createTab(
            'Neighborhood',
            //@ts-ignore
            place.neighborhoodSummary.overview.content,
            //@ts-ignore
            place.neighborhoodSummary.disclosureText,
            //@ts-ignore
            place.neighborhoodSummary.flagContentURI
        );
    }

    // --- 4. EV Amenity Summary (uses content blocks)) ---
    //@ts-ignore
    if (place.evChargeAmenitySummary) {
        //@ts-ignore
        const evSummary = place.evChargeAmenitySummary;
        const evContainer = document.createDocumentFragment();

        // Helper to build a safe DOM section for EV categories.
        const createSection = (title: string, text: string) => {
            const wrapper = document.createElement('div');
            wrapper.style.marginBottom = '15px'; // Or use a CSS class

            const titleEl = document.createElement('strong');
            titleEl.textContent = title;

            const textEl = document.createElement('div');
            textEl.textContent = text;

            wrapper.appendChild(titleEl);
            wrapper.appendChild(textEl);
            return wrapper;
        };

        // Check and append each potential section
        if (evSummary.overview?.content) {
            evContainer.appendChild(
                createSection('Overview', evSummary.overview.content)
            );
        }
        if (evSummary.coffee?.content) {
            evContainer.appendChild(
                createSection('Coffee', evSummary.coffee.content)
            );
        }
        if (evSummary.restaurant?.content) {
            evContainer.appendChild(
                createSection('Food', evSummary.restaurant.content)
            );
        }
        if (evSummary.store?.content) {
            evContainer.appendChild(
                createSection('Shopping', evSummary.store.content)
            );
        }

        // Only add the tab if the container has children
        if (evContainer.hasChildNodes()) {
            createTab(
                'EV Amenities',
                evContainer, // Passing a Node instead of string
                evSummary.disclosureText,
                evSummary.flagContentURI
            );
        }
    }

    // Safely handle the empty state.
    if (!firstTabActivated) {
        const msg = document.createElement('em');
        msg.textContent =
            'No AI summaries are available for this specific location.';
        summaryContent.replaceChildren(msg);
        aiDisclosure.textContent = '';
    }
}

initMap();
index.ts

Catatan: Baca panduan cara menggunakan TypeScript dan Google Maps.

JavaScript

// Define DOM elements.
const mapElement = document.querySelector('gmp-map');
const placeAutocomplete = document.querySelector('gmp-place-autocomplete');
const summaryPanel = document.getElementById('summary-panel');
const placeName = document.getElementById('place-name');
const placeAddress = document.getElementById('place-address');
const tabContainer = document.getElementById('tab-container');
const summaryContent = document.getElementById('summary-content');
const aiDisclosure = document.getElementById('ai-disclosure');
const flagContentLink = document.getElementById('flag-content-link');
let innerMap;
let marker;
async function initMap() {
    // Request needed libraries.
    const [] = await Promise.all([
        google.maps.importLibrary('marker'),
        google.maps.importLibrary('places'),
    ]);
    innerMap = mapElement.innerMap;
    innerMap.setOptions({
        mapTypeControl: false,
        streetViewControl: false,
        fullscreenControl: false,
    });
    // Bind autocomplete bounds to map bounds.
    google.maps.event.addListener(innerMap, 'bounds_changed', async () => {
        placeAutocomplete.locationRestriction = innerMap.getBounds();
    });
    // Create the marker.
    marker = new google.maps.marker.AdvancedMarkerElement({
        map: innerMap,
    });
    // Handle selection of an autocomplete result.
    // prettier-ignore
    // @ts-ignore
    placeAutocomplete.addEventListener('gmp-select', async ({ placePrediction }) => {
        const place = placePrediction.toPlace();
        // Fetch all summary fields.
        await place.fetchFields({
            fields: [
                'displayName',
                'formattedAddress',
                'location',
                'generativeSummary',
                'neighborhoodSummary',
                'reviewSummary',
                'evChargeAmenitySummary',
            ],
        });
        // Update the map viewport and position the marker.
        if (place.viewport) {
            innerMap.fitBounds(place.viewport);
        }
        else {
            innerMap.setCenter(place.location);
            innerMap.setZoom(17);
        }
        marker.position = place.location;
        // Update the panel UI.
        updateSummaryPanel(place);
    });
}
function updateSummaryPanel(place) {
    // Reset UI
    summaryPanel.classList.remove('hidden');
    tabContainer.innerHTML = ''; // innerHTML is OK here since we're clearing known child elements.
    summaryContent.textContent = '';
    aiDisclosure.textContent = '';
    placeName.textContent = place.displayName || '';
    placeAddress.textContent = place.formattedAddress || '';
    let firstTabActivated = false;
    /**
     * Safe Helper: Accepts either a text string or a DOM Node (like a div or DocumentFragment).
     */
    const createTab = (label, content, disclosure, flagUrl) => {
        const btn = document.createElement('button');
        btn.className = 'tab-button';
        btn.textContent = label;
        btn.onclick = () => {
            // Do nothing if the tab is already active.
            if (btn.classList.contains('active')) {
                return;
            }
            // Manage the active class state.
            document
                .querySelectorAll('.tab-button')
                .forEach((b) => b.classList.remove('active'));
            btn.classList.add('active');
            if (typeof content === 'string') {
                summaryContent.textContent = content;
            }
            else {
                summaryContent.replaceChildren(content.cloneNode(true));
            }
            // Set the disclosure text.
            aiDisclosure.textContent = disclosure || 'AI-generated content.';
            // Add the content flag URI.
            if (flagUrl) {
                flagContentLink.href = flagUrl;
                flagContentLink.textContent = "Report an issue";
            }
        };
        tabContainer.appendChild(btn);
        // Auto-select the first available summary.
        if (!firstTabActivated) {
            btn.click();
            firstTabActivated = true;
        }
    };
    // --- 1. Generative Summary (Place) ---
    //@ts-ignore
    if (place.generativeSummary?.overview) {
        createTab('Overview', 
        //@ts-ignore
        place.generativeSummary.overview, 
        //@ts-ignore
        place.generativeSummary.disclosureText, 
        //@ts-ignore
        place.generativeSummary.flagContentURI);
    }
    // --- 2. Review Summary ---
    //@ts-ignore
    if (place.reviewSummary?.text) {
        createTab('Reviews', 
        //@ts-ignore
        place.reviewSummary.text, 
        //@ts-ignore
        place.reviewSummary.disclosureText, 
        //@ts-ignore
        place.reviewSummary.flagContentURI);
    }
    // --- 3. Neighborhood Summary ---
    //@ts-ignore
    if (place.neighborhoodSummary?.overview?.content) {
        createTab('Neighborhood', 
        //@ts-ignore
        place.neighborhoodSummary.overview.content, 
        //@ts-ignore
        place.neighborhoodSummary.disclosureText, 
        //@ts-ignore
        place.neighborhoodSummary.flagContentURI);
    }
    // --- 4. EV Amenity Summary (uses content blocks)) ---
    //@ts-ignore
    if (place.evChargeAmenitySummary) {
        //@ts-ignore
        const evSummary = place.evChargeAmenitySummary;
        const evContainer = document.createDocumentFragment();
        // Helper to build a safe DOM section for EV categories.
        const createSection = (title, text) => {
            const wrapper = document.createElement('div');
            wrapper.style.marginBottom = '15px'; // Or use a CSS class
            const titleEl = document.createElement('strong');
            titleEl.textContent = title;
            const textEl = document.createElement('div');
            textEl.textContent = text;
            wrapper.appendChild(titleEl);
            wrapper.appendChild(textEl);
            return wrapper;
        };
        // Check and append each potential section
        if (evSummary.overview?.content) {
            evContainer.appendChild(createSection('Overview', evSummary.overview.content));
        }
        if (evSummary.coffee?.content) {
            evContainer.appendChild(createSection('Coffee', evSummary.coffee.content));
        }
        if (evSummary.restaurant?.content) {
            evContainer.appendChild(createSection('Food', evSummary.restaurant.content));
        }
        if (evSummary.store?.content) {
            evContainer.appendChild(createSection('Shopping', evSummary.store.content));
        }
        // Only add the tab if the container has children
        if (evContainer.hasChildNodes()) {
            createTab('EV Amenities', evContainer, // Passing a Node instead of string
            evSummary.disclosureText, evSummary.flagContentURI);
        }
    }
    // Safely handle the empty state.
    if (!firstTabActivated) {
        const msg = document.createElement('em');
        msg.textContent =
            'No AI summaries are available for this specific location.';
        summaryContent.replaceChildren(msg);
        aiDisclosure.textContent = '';
    }
}
initMap();
index.js

Catatan: JavaScript dikompilasi dari cuplikan TypeScript.

CSS

/* Reuse existing map height */
gmp-map {
    height: 100%;
}

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

/* Existing Autocomplete Card Style */
.place-autocomplete-card {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    margin: 10px;
    padding: 15px;
    font-family: Roboto, sans-serif;
    font-size: 1rem;
}

gmp-place-autocomplete {
    width: 300px;
}

/* New: Summary Panel Styles */
.summary-card {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    margin: 10px;
    padding: 0; /* Padding handled by children */
    font-family: Roboto, sans-serif;
    width: 350px;
    max-height: 80vh; /* Prevent overflow on small screens */
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.hidden {
    display: none;
}

#place-header {
    padding: 15px;
    background-color: #f8f9fa;
    border-bottom: 1px solid #ddd;
}

#place-header h2 {
    margin: 0 0 5px 0;
    font-size: 1.2rem;
}

#place-address {
    margin: 0;
    color: #555;
    font-size: 0.9rem;
}

/* Tab Navigation */
.tab-container {
    display: flex;
    border-bottom: 1px solid #ddd;
    background-color: #fff;
}

.tab-button {
    flex: 1;
    background: none;
    border: none;
    padding: 10px;
    cursor: pointer;
    font-weight: 500;
    color: #555;
    border-bottom: 3px solid transparent;
}

.tab-button:hover {
    background-color: #f1f1f1;
}

.tab-button.active {
    font-weight: bold;
    border-bottom: 3px solid #000000;
}

.tab-button.active:hover {
    background-color: #ffffff;
    cursor: default;
}

/* Content Area */
.content-area {
    padding: 15px;
    line-height: 1.5;
    font-size: 0.95rem;
    color: #333;
}

.disclosure-footer {
    font-size: 0.75rem;
    color: #666;
    padding: 10px 15px;
    border-top: 1px solid #eee;
    font-style: italic;
}

.flag-content-link {
    font-size: 0.75rem;
    color: #666;
    padding: 10px 15px;
    border-top: 1px solid #eee;
}
/* Reuse existing map height */
gmp-map {
    height: 100%;
}

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

/* Existing Autocomplete Card Style */
.place-autocomplete-card {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    margin: 10px;
    padding: 15px;
    font-family: Roboto, sans-serif;
    font-size: 1rem;
}

gmp-place-autocomplete {
    width: 300px;
}

/* New: Summary Panel Styles */
.summary-card {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    margin: 10px;
    padding: 0; /* Padding handled by children */
    font-family: Roboto, sans-serif;
    width: 350px;
    max-height: 80vh; /* Prevent overflow on small screens */
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.hidden {
    display: none;
}

#place-header {
    padding: 15px;
    background-color: #f8f9fa;
    border-bottom: 1px solid #ddd;
}

#place-header h2 {
    margin: 0 0 5px 0;
    font-size: 1.2rem;
}

#place-address {
    margin: 0;
    color: #555;
    font-size: 0.9rem;
}

/* Tab Navigation */
.tab-container {
    display: flex;
    border-bottom: 1px solid #ddd;
    background-color: #fff;
}

.tab-button {
    flex: 1;
    background: none;
    border: none;
    padding: 10px;
    cursor: pointer;
    font-weight: 500;
    color: #555;
    border-bottom: 3px solid transparent;
}

.tab-button:hover {
    background-color: #f1f1f1;
}

.tab-button.active {
    font-weight: bold;
    border-bottom: 3px solid #000000;
}

.tab-button.active:hover {
    background-color: #ffffff;
    cursor: default;
}

/* Content Area */
.content-area {
    padding: 15px;
    line-height: 1.5;
    font-size: 0.95rem;
    color: #333;
}

.disclosure-footer {
    font-size: 0.75rem;
    color: #666;
    padding: 10px 15px;
    border-top: 1px solid #eee;
    font-style: italic;
}

.flag-content-link {
    font-size: 0.75rem;
    color: #666;
    padding: 10px 15px;
}
style.css

HTML

<html>
    <head>
        <title>AI Place Summaries</title>
        <link rel="stylesheet" type="text/css" href="./style.css" />
        <script type="module" src="./index.js"></script>
        <!-- prettier-ignore -->
        <script>(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})
        ({key: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
    </head>
    <body>
        <gmp-map center="37.805, -122.425" zoom="14" map-id="DEMO_MAP_ID">
            <!-- Search Input Card -->
            <div
                class="place-autocomplete-card"
                slot="control-inline-start-block-start">
                <p>Search for a place with AI summaries:</p>
                <gmp-place-autocomplete></gmp-place-autocomplete>
            </div>

            <!-- Summary text panel (initially hidden) -->
            <div
                id="summary-panel"
                class="summary-card hidden"
                slot="control-inline-end-block-start">
                <div id="place-header">
                    <h2 id="place-name"></h2>
                    <p id="place-address"></p>
                </div>

                <!-- Tabs for toggling summary types -->
                <div class="tab-container" id="tab-container"></div>

                <!-- Content display area -->
                <div id="summary-content" class="content-area"></div>

                <!-- Legal/AI Disclosure -->
                <div id="ai-disclosure" class="disclosure-footer"></div>

                <!-- Flag content link -->
                <a id="flag-content-link" class="flag-content-link"></a>
            </div>
        </gmp-map>
    </body>
</html>
index.html

Mencoba Contoh

JSFiddle.net

Ringkasan yang dibuat AI adalah ringkasan tempat atau area yang memberikan insight bermanfaat tentang tempat tertentu, area di sekitar tempat, dan ulasan yang terkait dengan tempat. Ada tiga jenis ringkasan yang didukung AI:

• Ringkasan tempat: Ringkasan singkat 100 karakter khusus untuk ID tempat tertentu, yang menggabungkan berbagai jenis data menjadi ringkasan tingkat tinggi suatu tempat.

• Ringkasan ulasan: Ringkasan tempat yang dibuat hanya berdasarkan ulasan pengguna.

• Ringkasan area: Ringkasan yang dihasilkan untuk area di sekitar suatu tempat, yang memberikan konteks tambahan termasuk tempat menarik di sekitar. Ringkasan area dapat berupa salah satu dari dua jenis berikut:

  • Ringkasan lingkungan sekitar: Ringkasan umum lokasi menarik di sekitar untuk tempat dengan jenis premise, street_address, dan semua jenis dalam kategori Perumahan dan Penginapan.

  • Ringkasan fasilitas stasiun pengisian kendaraan listrik: Ringkasan tingkat tinggi tempat menarik terdekat untuk tempat dengan jenis electric_vehicle_charging_station.

Mengambil ringkasan yang didukung AI

Untuk mengambil dan menampilkan ringkasan yang didukung AI, ikuti langkah-langkah berikut:

1. Muat library Places.

   const { Place } = await google.maps.importLibrary("places");

2. Dapatkan instance Place. Cuplikan berikut menunjukkan cara membuat instance Place dari ID tempat:

   const place = new Place("ChIJaYaXFTqq3oARNy537Kb_W_c");

3. Dalam panggilan ke place.fetchFields(), tentukan kolom untuk jenis ringkasan yang ingin Anda gunakan. Dalam cuplikan berikut, semua kolom ringkasan diminta:

   await place.fetchFields({
     fields: [
       'generativeSummary',
       'neighborhoodSummary',
       'reviewSummary',
       'evChargeAmenitySummary'
       // Include other fields as needed.
     ]
   });
             

4. Ambil data ringkasan dengan mengakses properti generativeSummary, neighborhoodSummary, reviewSummary, dan evChargeAmenitySummary. Cuplikan berikut menunjukkan pengambilan ringkasan dari generativeSummary.

   const summaryText = place.generativeSummary.overview;
           

Karena tidak semua tempat memiliki ringkasan yang didukung AI, pastikan untuk memeriksa keberadaan data yang diperlukan sebelum menampilkannya kepada pengguna. Cuplikan berikut menggunakan pernyataan if untuk memeriksa generativeSummary:

if (place.generativeSummary) {
  overviewText = place.generativeSummary.overview;
} else {
  overviewText = 'No summary is available.';
}
    

Atau, gunakan operator nullish untuk memeriksa keberadaan ringkasan secara ringkas:

const overviewText = place.generativeSummary.overview ?? 'No summary is available.';
    

Menampilkan atribusi yang diperlukan

Semua ringkasan yang didukung AI yang ditampilkan di aplikasi Anda harus disertai dengan atribusi yang sesuai sesuai dengan kebijakan dan standar Google. Untuk mengetahui informasi selengkapnya, lihat Kebijakan dan atribusi untuk Maps JavaScript API.

Ringkasan tempat

Ringkasan tempat adalah ringkasan singkat 100 karakter yang khusus untuk ID tempat tertentu, untuk memberikan ringkasan tingkat tinggi tentang suatu tempat. Ringkasan tempat dapat menyoroti makanan, layanan, atau barang populer yang tersedia untuk dibeli di suatu lokasi:

• "Restoran Forum Shops yang menyajikan hidangan tradisional Italia dalam porsi besar di tempat kasual."

• "Salon bergaya yang menawarkan potongan rambut dan pewarnaan, serta penataan rambut."

• "Toko besar dengan banyak vendor yang menawarkan berbagai dekorasi, furnitur, dan pakaian vintage."

Ringkasan tempat tersedia untuk jenis tempat yang ditampilkan di Jenis yang didukung untuk kategori Budaya, Hiburan dan Rekreasi, Makanan dan Minuman, Belanja, Layanan, dan Olahraga.

Ringkasan tempat didukung untuk tempat menarik dalam bahasa dan wilayah berikut:

Language	Wilayah
Inggris	India Amerika Serikat

Catatan: Ringkasan tempat tidak dijamin untuk semua tempat.

Meminta ringkasan tempat

Untuk meminta ringkasan tempat generatif, sertakan kolom generativeSummary saat memanggil fetchFields():

await place.fetchFields({
    fields: [
        'generativeSummary',
        // Include other fields as needed.
    ],
});
    

Gunakan properti generativeSummary untuk mengambil ringkasan tempat. Cuplikan berikut mengambil ringkasan dan teks pengungkapan dari generativeSummary:

if (place.generativeSummary) {
    console.log("Place Overview:", place.generativeSummary.overview);
    console.log("Disclosure:", place.generativeSummary.disclosureText);
}
    

Ringkasan ulasan

Ringkasan ulasan adalah ringkasan yang dibuat hanya berdasarkan ulasan pengguna. Dengan menyintesis elemen utama ulasan pengguna, seperti atribut tempat dan sentimen pengulas, ringkasan ulasan memberikan insight tingkat tinggi dan membantu pengguna membuat keputusan yang tepat.

Misalnya, ringkasan ulasan Ferry Building di San Francisco mencakup informasi mulai dari makanan dan belanja hingga pemandangan dan suasana:

"Pengunjung mengatakan bahwa landmark bersejarah ini menawarkan beragam pilihan toko, restoran, dan pasar petani, dengan banyak yang memuji pemandangan teluk dan kota. Mereka juga menyoroti suasana yang semarak, akses feri yang nyaman ke tujuan lain, dan peluang untuk menikmati bisnis lokal."

Ringkasan ulasan didukung untuk tempat menarik dalam bahasa dan wilayah berikut:

Language	Wilayah
Inggris	Argentina, Bolivia, Brasil, Cile, Kolombia, Kosta Rika, Republik Dominika, Ekuador, Guatemala, India, Jepang, Meksiko, Paraguay, Peru, Inggris Raya, Amerika Serikat, Uruguay, Venezuela
Jepang	Jepang
Portugis	Brasil
Spanyol	Argentina, Bolivia, Cile, Kolombia, Kosta Rika, Republik Dominika, Ekuador, Guatemala, Meksiko, Paraguay, Peru, Amerika Serikat, Uruguay, Venezuela

Catatan: Ringkasan ulasan tidak dijamin tersedia untuk semua tempat.

Meminta ringkasan peninjauan

Untuk meminta ringkasan ulasan, sertakan kolom reviewSummary saat memanggil fetchFields():

await place.fetchFields({
    fields: [
        'reviewSummary',
        // Include other fields as needed.
    ],
});
  

Gunakan properti reviewSummary untuk mengambil ringkasan ulasan. Untuk mengambil ringkasan ulasan, akses properti reviewSummary.text. Cuplikan berikut mengambil teks dari reviewSummary.

if (place.reviewSummary) {
    console.log("Place Review Summary:", place.reviewSummary.text);
}
  

Ringkasan area

Ringkasan area dibuat untuk area di sekitar suatu tempat. Ringkasan area memberikan konteks tambahan untuk suatu lokasi, termasuk tempat menarik di sekitar, sehingga pengguna dapat membuat keputusan yang lebih tepat tentang tempat tujuan dan aktivitas yang akan dilakukan setelah tiba di sana. Misalnya, saat mengunjungi kota baru, Anda dapat melihat ringkasan lingkungan yang dibuat untuk hotel guna mempelajari lebih lanjut area sekitarnya:

• "Kawasan yang ramai di San Francisco ini, yang memadukan North Beach dan Chinatown, terletak di barat laut Financial District dan menampilkan landmark sastra, objek wisata budaya yang unik, dan beragam restoran. Tempat terkenal di antaranya City Lights Bookstore yang ikonis, Cable Car Museum yang menarik, dan jalanan Chinatown yang ramai."

Jika Anda mempertimbangkan untuk mengisi daya kendaraan listrik, Anda dapat melihat ringkasan yang dibuat untuk stasiun pengisian daya kendaraan listrik untuk mempelajari lebih lanjut area di sekitarnya:

• "Area ini menawarkan berbagai pilihan tempat makan dalam jarak 9 menit berjalan kaki, termasuk Starbucks, Sushi Jin, dan Safeway."

Selain deskripsi area, respons juga berisi daftar instance Place untuk tempat yang dirujuk dalam deskripsi; panggil fetchFields() pada instance Place ini untuk meminta detail lebih lanjut untuk setiap tempat.

Ada dua jenis ringkasan area yang didukung AI:

• Ringkasan lingkungan sekitar: Ringkasan umum lokasi menarik di sekitar untuk tempat dengan jenis premise, street_address, dan semua jenis dalam kategori Perumahan dan Penginapan.

• Ringkasan fasilitas stasiun pengisian kendaraan listrik: Ringkasan tingkat tinggi tempat menarik terdekat untuk tempat dengan jenis electric_vehicle_charging_station.

Ringkasan area didukung untuk tempat menarik dalam bahasa dan wilayah berikut:

Language	Wilayah
Inggris	Amerika Serikat

Catatan: Ringkasan area tidak dijamin untuk semua tempat.

Meminta ringkasan lingkungan

Anda dapat meminta ringkasan lingkungan untuk tempat dengan jenis premise, street_address, dan semua jenis dalam kategori Perumahan dan Penginapan. Untuk meminta ringkasan lingkungan, sertakan kolom neighborhoodSummary saat memanggil fetchFields():

await place.fetchFields({
    fields: [
        'neighborhoodSummary',
        // Include other fields as needed.
    ],
});
  

Gunakan properti neighborhoodSummary untuk mengambil ringkasan lingkungan. Untuk mengambil ringkasan lingkungan, akses properti neighborhoodSummary.content untuk mendapatkan teks.

Cuplikan berikut mengambil konten neighborhoodSummary:

if (place.neighborhoodSummary) {
    console.log("Place Neighborhood Summary:", place.neighborhoodSummary.overview.content);
}
  

Meminta ringkasan fasilitas stasiun pengisian kendaraan listrik

Anda dapat meminta ringkasan fasilitas SPKLU untuk tempat dengan jenis electric_vehicle_charging_station. Ringkasan fasilitas EVCS menawarkan empat jenis ringkasan: overview, coffee, restaurant, dan store; oleh karena itu, struktur datanya adalah array objek, yang masing-masing berisi ringkasan. Untuk meminta ringkasan fasilitas SPKLU, sertakan kolom evChargeAmenitySummary saat memanggil fetchFields():

await place.fetchFields({
    fields: [
        'evChargeAmenitySummary',
        // Include other fields as needed.
    ],
});
  

Gunakan properti evChargeAmenitySummary untuk mengambil ringkasan fasilitas stasiun pengisian kendaraan listrik. Untuk mengambil teks dari ringkasan, akses properti content dari properti evChargeAmenitySummary.overview, evChargeAmenitySummary.coffee, evChargeAmenitySummary.restaurant, dan evChargeAmenitySummary.store.

Cuplikan berikut mengambil konten evChargeAmenitySummary:

// overview, coffee, restaurant, store.
if (place.evChargeAmenitySummary) {
    console.log("Place EVCS Amenity Summary:", place.evChargeAmenitySummary.overview.content);
    console.log("Coffee:", place.evChargeAmenitySummary.coffee.content);
    console.log("Restaurants:", place.evChargeAmenitySummary.restaurant.content);
    console.log("Stores:", place.evChargeAmenitySummary.store.content);
}