Places UI Kit: यह इस्तेमाल के लिए तैयार लाइब्रेरी है. इससे डेवलपर को अपनी ज़रूरत के मुताबिक बदलाव करने और कंट्रोल करने की सुविधा मिलती है. इसे आज़माएं और यूआई किट के इस्तेमाल से जुड़ा अपना अनुभव शेयर करें.

इस पेज का अनुवाद Cloud Translation API से किया गया है.

एआई की मदद से तैयार की गई खास जानकारी

पूरे उदाहरण का सोर्स कोड देखें

एआई की मदद से तैयार की गई खास जानकारी देखने के लिए, जगहें खोजें. खोजने के लिए सुझाए गए कुछ शब्द:

"होटल" के लिए, आस-पास की जगहों की खास जानकारी.
ईवीसीएस की सुविधाओं की खास जानकारी के लिए, "ईवी चार्जिंग स्टेशन" का इस्तेमाल किया जाता है.
किसी भी रेस्टोरेंट या कारोबार के लिए, जगह और समीक्षा की खास जानकारी.

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

सीएसएस

/* 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>
    <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

सैंपल आज़माएं

JSFiddle.net

एआई की मदद से जनरेट की गई खास जानकारी, किसी जगह या इलाके के बारे में होती है. इससे आपको इन चीज़ों के बारे में अहम जानकारी मिलती है: किसी जगह के बारे में, किसी जगह के आस-पास के इलाके के बारे में, और किसी जगह से जुड़ी समीक्षाओं के बारे में. एआई की मदद से तैयार की गई खास जानकारी तीन तरह की होती है:

जगह की खास जानकारी: किसी जगह के आईडी के हिसाब से, 100 वर्णों में दी गई खास जानकारी. इसमें अलग-अलग तरह के डेटा को इकट्ठा करके, जगह की खास जानकारी दी जाती है.
समीक्षा की खास जानकारी: किसी जगह के बारे में जनरेट की गई खास जानकारी. यह सिर्फ़ लोगों की समीक्षाओं के आधार पर जनरेट की जाती है.
इलाके की खास जानकारी: किसी जगह के आस-पास के इलाके के बारे में जनरेट की गई खास जानकारी. इसमें आस-पास की दिलचस्प जगहों के बारे में अतिरिक्त जानकारी भी शामिल होती है. जगह की खास जानकारी दो तरह की हो सकती है:
- आस-पास की जगहों की खास जानकारी: इसमें premise, street_address, और आवास और ठहरने की जगह कैटगरी की सभी जगहों के आस-पास की लोकप्रिय जगहों की खास जानकारी होती है.
- इलेक्ट्रिक वाहन चार्जिंग स्टेशन पर उपलब्ध सुविधाओं के बारे में खास जानकारी: electric_vehicle_charging_station टाइप वाली जगहों के आस-पास मौजूद लोकप्रिय जगहों के बारे में खास जानकारी.

एआई की मदद से जनरेट हुई खास जानकारी पाना

एआई की मदद से तैयार की गई खास जानकारी को वापस पाने और उसे दिखाने के लिए, यह तरीका अपनाएं:

Places लाइब्रेरी दिखाओ.

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

Place का इंस्टेंस पाएं. नीचे दिए गए स्निपेट में, प्लेस आईडी से Place इंस्टेंस बनाने का तरीका दिखाया गया है:
```
const place = new Place("ChIJaYaXFTqq3oARNy537Kb_W_c");
```
place.fetchFields() को कॉल करते समय, उन फ़ील्ड के बारे में बताएं जिनके लिए आपको खास तरह की खास जानकारी चाहिए. नीचे दिए गए स्निपेट में, सभी खास जानकारी वाले फ़ील्ड के लिए अनुरोध किया गया है:
```
await place.fetchFields({
  fields: [
    'generativeSummary',
    'neighborhoodSummary',
    'reviewSummary',
    'evChargeAmenitySummary'
    // Include other fields as needed.
  ]
});
          
```
generativeSummary, neighborhoodSummary, reviewSummary, और evChargeAmenitySummary प्रॉपर्टी ऐक्सेस करके, खास जानकारी वाला डेटा पाएं. इस स्निपेट में, generativeSummary से खास जानकारी पाने का तरीका दिखाया गया है.
```
const summaryText = place.generativeSummary.overview;
        
```

ऐसा इसलिए है, क्योंकि सभी जगहों पर एआई की मदद से जवाब देने की सुविधा उपलब्ध नहीं है. इसलिए, उपयोगकर्ताओं को जवाब दिखाने से पहले, यह ज़रूर देख लें कि आपके पास ज़रूरी डेटा मौजूद है या नहीं. नीचे दिए गए स्निपेट में, if स्टेटमेंट का इस्तेमाल करके generativeSummary की जांच की गई है:

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

इसके अलावा, खास जानकारी मौजूद है या नहीं, इसकी जांच करने के लिए, नलिश ऑपरेटर का इस्तेमाल करें:

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

ज़रूरी एट्रिब्यूशन दिखाना

आपके ऐप्लिकेशन में एआई की मदद से दिखाई जाने वाली सभी खास जानकारी के साथ, Google की नीतियों और मानकों के मुताबिक सही एट्रिब्यूशन होना चाहिए. ज़्यादा जानकारी के लिए, Maps JavaScript API के लिए नीतियां और एट्रिब्यूशन देखें.

जगह की खास जानकारी

जगह की खास जानकारी में, किसी जगह के बारे में 100 वर्णों में संक्षिप्त जानकारी दी जाती है. यह जानकारी, किसी जगह के आईडी के हिसाब से दी जाती है, ताकि जगह के बारे में खास जानकारी मिल सके. जगह की खास जानकारी में, किसी जगह पर मिलने वाले लोकप्रिय खाने-पीने के सामान, सेवाएं या खरीदारी के लिए उपलब्ध सामान हाइलाइट किए जा सकते हैं:

"फ़ोरम शॉप में मौजूद रेस्टोरेंट, जहां कैजुअल माहौल में पारंपरिक इटैलियन पकवान परोसे जाते हैं."
"स्टाइलिश सैलून, जहां बाल काटे और रंगे जाते हैं. साथ ही, ब्लोआउट की सुविधा भी मिलती है."
"बड़ा स्टोर, जहां कई वेंडर अलग-अलग तरह की पुरानी सजावट की चीज़ें, फ़र्नीचर, और कपड़े बेचते हैं."

जगह की खास जानकारी, सपोर्ट किए गए टाइप में दिखाई गई जगहों के लिए उपलब्ध है. ये जगहें, संस्कृति, मनोरंजन और मौज-मस्ती, खान-पान, शॉपिंग, सेवाएं, और खेल-कूद कैटगरी में आती हैं.

जगह की खास जानकारी देने वाली सुविधा, इन भाषाओं और देशों/इलाकों में उपलब्ध है:

भाषा	क्षेत्र
अंग्रेज़ी	भारत अमेरिका

भाषा

क्षेत्र

अंग्रेज़ी

भारत

अमेरिका

किसी जगह के बारे में खास जानकारी पाने का अनुरोध करना

जगह के बारे में जनरेटिव एआई से मिली जानकारी का अनुरोध करने के लिए, fetchFields() को कॉल करते समय generativeSummary फ़ील्ड शामिल करें:

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

जगह की खास जानकारी पाने के लिए, generativeSummary प्रॉपर्टी का इस्तेमाल करें. यहां दिए गए स्निपेट में, generativeSummary से खास जानकारी और डिसक्लोज़र टेक्स्ट को वापस पाने का तरीका बताया गया है:

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

समीक्षाओं की खास जानकारी

समीक्षा की खास जानकारी, सिर्फ़ उपयोगकर्ताओं की समीक्षाओं के आधार पर जनरेट की गई खास जानकारी होती है. समीक्षा की खास जानकारी में, उपयोगकर्ताओं की समीक्षाओं के मुख्य पहलुओं को शामिल किया जाता है. जैसे, जगह की जानकारी और समीक्षा करने वाले व्यक्ति की भावनाएं. इससे लोगों को अहम जानकारी मिलती है और वे सोच-समझकर फ़ैसले ले पाते हैं.

उदाहरण के लिए, सैन फ़्रांसिस्को में मौजूद फ़ेरी बिल्डिंग की समीक्षा की खास जानकारी में, खाने-पीने और खरीदारी से लेकर नज़ारों और माहौल तक की जानकारी शामिल होती है:

"यहां आने वाले लोगों का कहना है कि इस ऐतिहासिक जगह पर कई तरह की दुकानें, रेस्टोरेंट, और किसानों का बाज़ार है. कई लोगों ने खाड़ी और शहर के नज़ारों की तारीफ़ की है. उन्होंने यहां के खुशनुमा माहौल, अन्य जगहों पर जाने के लिए फ़ेरी की सुविधा, और स्थानीय कारोबारों का आनंद लेने के मौके के बारे में भी बताया है."

समीक्षा की खास जानकारी, इन भाषाओं और देशों/इलाकों में मौजूद लोकप्रिय जगहों के लिए उपलब्ध है:

भाषा	क्षेत्र
अंग्रेज़ी	अर्जेंटीना, बोलिविया, ब्राज़ील, चिली, कोलंबिया, कोस्टा रिका, डॉमिनिकन रिपब्लिक, इक्वाडोर, ग्वाटेमाला, भारत, जापान, मेक्सिको, पराग्वे, पेरू, यूनाइटेड किंगडम, अमेरिका, उरुग्वे, वेनेज़ुएला
जापानी	जापान
पॉर्चुगीज़	ब्राज़ील
स्पैनिश	अर्जेंटीना, बोलिविया, चिली, कोलंबिया, कोस्टा रिका, डॉमिनिकन रिपब्लिक, इक्वाडोर, ग्वाटेमाला, मेक्सिको, पराग्वे, पेरू, अमेरिका, उरुग्वे, वेनेज़ुएला

समीक्षा की खास जानकारी पाने का अनुरोध करना

समीक्षा की खास जानकारी का अनुरोध करने के लिए, fetchFields() को कॉल करते समय reviewSummary फ़ील्ड शामिल करें:

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

समीक्षा की खास जानकारी वापस पाने के लिए, reviewSummary प्रॉपर्टी का इस्तेमाल करें. समीक्षा की खास जानकारी पाने के लिए, reviewSummary.text प्रॉपर्टी को ऐक्सेस करें. यहां दिए गए स्निपेट में, reviewSummary से टेक्स्ट वापस पाने का तरीका बताया गया है.

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

इलाके की खास जानकारी

किसी जगह के आस-पास के इलाके के लिए, खास जानकारी जनरेट की जाती है. इलाके की खास जानकारी से किसी जगह के बारे में ज़्यादा जानकारी मिलती है. इसमें आस-पास की दिलचस्प जगहों के बारे में जानकारी भी शामिल होती है, ताकि लोग यह तय कर सकें कि उन्हें कहां जाना है और वहां जाकर क्या करना है. उदाहरण के लिए, किसी नए शहर में जाने पर, होटल के आस-पास के इलाके के बारे में ज़्यादा जानने के लिए, होटल के लिए जनरेट की गई पड़ोस की खास जानकारी देखी जा सकती है:

"सैन फ़्रांसिस्को का यह रंगीन इलाका, नॉर्थ बीच और चाइनाटाउन का मिश्रण है. यह फ़ाइनेंशियल डिस्ट्रिक्ट के उत्तर-पश्चिम में है. यहां साहित्यिक जगहें, अनोखे सांस्कृतिक आकर्षण, और कई तरह के रेस्टोरेंट हैं. यहां की खास जगहों में मशहूर सिटी लाइट्स बुकस्टोर, दिलचस्प केबल कार म्यूज़ियम, और चहल-पहल वाली चाइनाटाउन की सड़कें शामिल हैं."

अगर आपको इलेक्ट्रिक वाहन चार्ज करना है, तो इलेक्ट्रिक वाहन चार्जिंग स्टेशन के लिए जनरेट की गई खास जानकारी देखी जा सकती है. इससे आपको आस-पास की जगह के बारे में ज़्यादा जानकारी मिलेगी:

"इस इलाके में, नौ मिनट की पैदल दूरी पर खाने-पीने के कई विकल्प मौजूद हैं. इनमें Starbucks, Sushi Jin, और Safeway शामिल हैं."

जवाब में, इलाके के बारे में जानकारी के साथ-साथ, जानकारी में शामिल जगहों के Place इंस्टेंस की सूची भी होती है. हर जगह के बारे में ज़्यादा जानकारी पाने के लिए, इन Place इंस्टेंस पर Place कॉल करें.fetchFields()

एआई की मदद से तैयार की गई इलाके की खास जानकारी दो तरह की होती है:

आस-पास की जगहों की खास जानकारी: इसमें premise, street_address, और आवास और ठहरने की जगह कैटगरी की सभी जगहों के आस-पास की लोकप्रिय जगहों की खास जानकारी होती है.
इलेक्ट्रिक वाहन चार्जिंग स्टेशन पर उपलब्ध सुविधाओं के बारे में खास जानकारी: electric_vehicle_charging_station टाइप वाली जगहों के आस-पास मौजूद लोकप्रिय जगहों के बारे में खास जानकारी.

दिलचस्पी की जगहों के बारे में खास जानकारी देने वाली सुविधा, इन भाषाओं और देशों/इलाकों में उपलब्ध है:

भाषा	क्षेत्र
अंग्रेज़ी	अमेरिका

आस-पास के इलाके के बारे में खास जानकारी पाने का अनुरोध करना

premise, street_address, और आवास और ठहरने की जगह कैटगरी में मौजूद सभी टाइप की जगहों के लिए, आस-पास की जगहों की खास जानकारी का अनुरोध किया जा सकता है. आस-पास के इलाके की खास जानकारी का अनुरोध करने के लिए, fetchFields() को कॉल करते समय neighborhoodSummary फ़ील्ड शामिल करें:

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

आस-पास के इलाके की खास जानकारी पाने के लिए, neighborhoodSummary प्रॉपर्टी का इस्तेमाल करें. आस-पास के इलाके की खास जानकारी पाने के लिए, neighborhoodSummary.content प्रॉपर्टी को ऐक्सेस करें, ताकि आपको टेक्स्ट मिल सके.

यहां दिया गया स्निपेट, neighborhoodSummary का कॉन्टेंट वापस पाता है:

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

इलेक्ट्रिक वाहन चार्जिंग स्टेशन की सुविधा के बारे में खास जानकारी पाने का अनुरोध करना

electric_vehicle_charging_station टाइप वाली जगहों के लिए, इलेक्ट्रिक वाहन चार्जिंग स्टेशन की सुविधाओं की खास जानकारी का अनुरोध किया जा सकता है. ईवीसीएस की सुविधा के बारे में खास जानकारी देने वाले फ़ील्ड में चार तरह की खास जानकारी दी जाती है: overview, coffee, restaurant, और store. इसलिए, डेटा स्ट्रक्चर ऑब्जेक्ट का एक कलेक्शन होता है. हर ऑब्जेक्ट में खास जानकारी होती है. इलेक्ट्रिक वाहन चार्जिंग स्टेशन की सुविधाओं की खास जानकारी का अनुरोध करने के लिए, fetchFields() को कॉल करते समय evChargeAmenitySummary फ़ील्ड शामिल करें:

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

इलेक्ट्रिक वाहन के चार्जिंग स्टेशन की सुविधाओं के बारे में खास जानकारी पाने के लिए, evChargeAmenitySummary प्रॉपर्टी का इस्तेमाल करें. खास जानकारी से टेक्स्ट पाने के लिए, evChargeAmenitySummary.overview, evChargeAmenitySummary.coffee, evChargeAmenitySummary.restaurant, और evChargeAmenitySummary.store प्रॉपर्टी की content प्रॉपर्टी को ऐक्सेस करें.

यहां दिया गया स्निपेट, 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);
}