Riepiloghi basati sull'AI

Visualizza il codice sorgente dell'esempio completo

Cerca luoghi per visualizzare i riepiloghi basati sull'AI. Alcune ricerche suggerite:

  • "Hotel" per i riepiloghi dei quartieri.
  • "Stazione di ricarica EV" per i riepiloghi dei servizi EVCS.
  • Qualsiasi ristorante o attività per i riepiloghi di luoghi e recensioni.

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

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

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

Prova campione

I riepiloghi basati sull'AI sono panoramiche di un luogo o di un'area che forniscono informazioni utili su luoghi specifici, l'area intorno a un luogo e le recensioni associate a un luogo. Esistono tre tipi diversi di riepiloghi basati sull'AI:

  • Riepilogo del luogo: una breve panoramica di 100 caratteri specifica per un determinato ID luogo, che aggrega molti tipi diversi di dati in un'istantanea di alto livello di un luogo.

  • Riepilogo recensioni: un riepilogo generato di un luogo basato esclusivamente sulle recensioni degli utenti.

  • Riepilogo dell'area: un riepilogo generato per l'area circostante un luogo, che fornisce un contesto aggiuntivo, inclusi i punti di interesse nelle vicinanze. I riepiloghi dell'area possono essere di due tipi:

    • Riepilogo del quartiere: una panoramica generale dei punti di interesse nelle vicinanze per i luoghi con tipi premise, street_address e tutti i tipi nelle categorie Alloggi e Strutture ricettive.

    • Riepilogo dei servizi delle stazioni di ricarica per veicoli elettrici: una panoramica generale dei punti di interesse nelle vicinanze per i luoghi di tipo electric_vehicle_charging_station.

Recuperare riepiloghi basati sull'AI

Per recuperare e visualizzare i riepiloghi basati sull'AI, segui questi passaggi:

  1. Carica la raccolta Places. 

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

  2. Ottieni un'istanza Place. Il seguente snippet mostra la creazione di un'istanza Place da un ID luogo: 

    const place = new Place("ChIJaYaXFTqq3oARNy537Kb_W_c");

  3. Nella chiamata a place.fetchFields(), specifica i campi per i tipi di riepiloghi che vuoi utilizzare. Nel seguente snippet vengono richiesti tutti i campi di riepilogo:

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

  4. Recupera i dati di riepilogo accedendo rispettivamente alle proprietà generativeSummary, neighborhoodSummary, reviewSummary e evChargeAmenitySummary. Il seguente snippet mostra il recupero della panoramica da un generativeSummary. 

    const summaryText = place.generativeSummary.overview;

Poiché non tutti i luoghi dispongono di riepiloghi basati sull'AI, assicurati di verificare la presenza dei dati necessari prima di mostrarli agli utenti. Lo snippet seguente utilizza un'istruzione if per verificare la presenza di un generativeSummary: 

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

In alternativa, utilizza un operatore nullish per verificare in modo conciso la presenza di un riepilogo:

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

Visualizzare le attribuzioni richieste

Tutti i riepiloghi basati sull'AI visualizzati nella tua app devono essere accompagnati dall'attribuzione appropriata in conformità con le norme e gli standard di Google. Per ulteriori informazioni, consulta Norme e attribuzioni per l'API Maps JavaScript.

Riepiloghi dei luoghi

I riepiloghi dei luoghi sono brevi panoramiche di 100 caratteri specifiche per un determinato ID luogo, per fornire un'istantanea generale di un luogo. I riepiloghi dei luoghi possono mettere in evidenza cibi, servizi o beni popolari disponibili per l'acquisto in una località:

  • "Ristorante del Forum Shops che serve abbondanti porzioni di piatti tradizionali italiani in un locale informale".

  • "Elegante salone che offre tagli e colorazioni, oltre a pieghe."

  • "Grande negozio con molti venditori che offrono una varietà di decorazioni, mobili e abiti vintage".

I riepiloghi dei luoghi sono disponibili per i tipi di luoghi mostrati in Tipi supportati per le categorie Cultura, Intrattenimento e svago, Cibi e bevande, Shopping, Servizi e Sport.

I riepiloghi dei luoghi sono supportati per i punti di interesse nelle seguenti lingue e regioni:

Lingua Regione
Inglese

India

Stati Uniti

Richiedere un riepilogo di un luogo

Per richiedere un riepilogo del luogo generativo, includi il campo generativeSummary quando chiami fetchFields(): 

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

Utilizza la proprietà generativeSummary per recuperare i riepiloghi dei luoghi. Il seguente snippet recupera il testo della panoramica e dell'informativa da un generativeSummary: 

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

Riepiloghi delle recensioni

I riepiloghi delle recensioni sono riepiloghi generati esclusivamente in base alle recensioni degli utenti. Riassumendo gli elementi chiave delle recensioni degli utenti, come gli attributi del luogo e il sentiment dei recensori, i riepiloghi delle recensioni forniscono informazioni di alto livello e aiutano gli utenti a prendere decisioni informate.

Ad esempio, un riepilogo delle recensioni del Ferry Building di San Francisco include informazioni che vanno da cibo e shopping a panorami e atmosfera:

"I visitatori affermano che questo punto di riferimento storico offre una vasta scelta di negozi, ristoranti e un mercato agricolo, e molti lodano la vista sulla baia e sulla città. Inoltre, mettono in evidenza l'atmosfera vivace, la comodità di raggiungere altre destinazioni in traghetto e l'opportunità di godersi le attività locali".

I riepiloghi delle recensioni sono supportati per i punti d'interesse nelle seguenti lingue e regioni:

Lingua Regione
Inglese Argentina, Bolivia, Brasile, Cile, Colombia, Costa Rica, Ecuador, Guatemala, India, Giappone, Messico, Paraguay, Perù, Regno Unito, Repubblica Dominicana, Stati Uniti, Uruguay, Venezuela
Giapponese Giappone
Portoghese Brasile
Spagnolo Argentina, Bolivia, Cile, Colombia, Costa Rica, Ecuador, Guatemala, Messico, Paraguay, Perù, Repubblica Dominicana, Stati Uniti, Uruguay, Venezuela

Richiedere un riepilogo delle recensioni

Per richiedere un riepilogo della revisione, includi il campo reviewSummary quando chiami fetchFields(): 

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

Utilizza la proprietà reviewSummary per recuperare i riepiloghi delle recensioni. Per recuperare i riepiloghi delle recensioni, accedi alla proprietà reviewSummary.text. Lo snippet seguente recupera il testo da un reviewSummary. 

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

Riepiloghi delle aree

I riepiloghi dell'area vengono generati per l'area circostante un luogo. I riepiloghi dell'area forniscono un contesto aggiuntivo per una località, inclusi i punti di interesse nelle vicinanze, in modo che gli utenti possano prendere una decisione più informata su dove andare e cosa fare una volta arrivati. Ad esempio, quando visiti una nuova città, puoi visualizzare un riepilogo del quartiere generato per un hotel per scoprire di più sulla zona circostante:

  • "Questa vivace zona di San Francisco, che unisce North Beach e Chinatown, si trova a nord-ovest del quartiere finanziario e presenta punti di riferimento letterari, attrazioni culturali uniche e una variegata offerta gastronomica. Tra i luoghi più importanti ci sono l'iconica libreria City Lights, l'affascinante Cable Car Museum e le vivaci strade di Chinatown".

Se stai pensando di ricaricare un veicolo elettrico, puoi visualizzare un riepilogo generato per una stazione di ricarica per veicoli elettrici per scoprire di più sulla zona circostante:

  • "Questa zona offre una vasta gamma di opzioni di ristorazione a 9 minuti a piedi, tra cui Starbucks, Sushi Jin e Safeway".

Oltre a una descrizione dell'area, la risposta contiene anche un elenco di istanze Place per i luoghi a cui viene fatto riferimento nella descrizione; chiama fetchFields() su queste istanze Place per richiedere ulteriori dettagli per ogni luogo.

Esistono due tipi di riepiloghi dell'area basati sull'AI:

  • Riepilogo del quartiere: una panoramica generale dei punti di interesse nelle vicinanze per i luoghi con tipi premise, street_address e tutti i tipi nelle categorie Alloggi e Strutture ricettive.

  • Riepilogo dei servizi delle stazioni di ricarica per veicoli elettrici: una panoramica generale dei punti di interesse nelle vicinanze per i luoghi di tipo electric_vehicle_charging_station.

I riepiloghi delle aree sono supportati per i punti d'interesse nelle seguenti lingue e regioni:

Lingua Regione
Inglese Stati Uniti

Richiedere un riepilogo del quartiere

Puoi richiedere i riepiloghi del quartiere per i luoghi con i tipi premise, street_address e tutti i tipi nelle categorie Alloggi e Strutture ricettive. Per richiedere un riepilogo del quartiere, includi il campo neighborhoodSummary quando chiami fetchFields(): 

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

Utilizza la proprietà neighborhoodSummary per recuperare i riepiloghi dei quartieri. Per recuperare i riepiloghi del quartiere, accedi alla proprietà neighborhoodSummary.content per ottenere il testo.

Il seguente snippet recupera i contenuti di un neighborhoodSummary: 

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

Richiedere un riepilogo dei servizi di ricarica per veicoli elettrici

Puoi richiedere i riepiloghi dei servizi delle stazioni di ricarica per veicoli elettrici per i luoghi di tipo electric_vehicle_charging_station. Il riepilogo dei servizi EVCS offre quattro tipi di riepiloghi: overview, coffee, restaurant e store. Per questo motivo, la struttura dei dati è un array di oggetti, ognuno dei quali contiene un riepilogo. Per richiedere un riepilogo dei servizi di ricarica per veicoli elettrici, includi il campo evChargeAmenitySummary quando chiami fetchFields(): 

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

Utilizza la proprietà evChargeAmenitySummary per recuperare i riepiloghi dei servizi delle stazioni di ricarica per veicoli elettrici. Per recuperare il testo dai riepiloghi, accedi alla proprietà content delle proprietà evChargeAmenitySummary.overview, evChargeAmenitySummary.coffee, evChargeAmenitySummary.restaurant e evChargeAmenitySummary.store.

Il seguente snippet recupera i contenuti di un 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);
}