टेक्स्ट से खोजें (नई सुविधा)

प्लैटफ़ॉर्म चुनें: Android iOS JavaScript वेब सेवा

यूरोपियन इकनॉमिक एरिया (ईईए) के डेवलपर

अगर आपका बिलिंग पता यूरोपियन इकनॉमिक एरिया में है, तो 8 जुलाई 2025 से, Google Maps Platform की ईईए से जुड़ी सेवा की शर्तें सेवाओं के आपके इस्तेमाल पर लागू होंगी. यह सुविधा, देश/इलाके के हिसाब से अलग-अलग हो सकती है. ज़्यादा जानें.

टेक्स्ट से खोजें (नया) सुविधा, टेक्स्ट क्वेरी लेती है और उससे मेल खाने वाली जगहों की सूची दिखाती है.

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

Text Search (नया) सुविधा का इस्तेमाल करने के लिए, आपको अपने Google Cloud प्रोजेक्ट पर "Places API (नया)" सुविधा चालू करनी होगी. ज़्यादा जानकारी के लिए, शुरू करें लेख पढ़ें.

टेक्स्ट क्वेरी की मदद से जगहें ढूंढना

टेक्स्ट क्वेरी या फ़ोन नंबर से जगहों की सूची पाने के लिए, searchByText को कॉल करें. अनुरोध का इस्तेमाल करके, खोज के पैरामीटर तय करें. इसके बाद, searchByText() को कॉल करें. नतीजे, Place ऑब्जेक्ट की सूची के तौर पर दिखाए जाते हैं. इनसे जगह की जानकारी पाई जा सकती है. यहां दिए गए स्निपेट में, searchByText को कॉल करने और अनुरोध का एक उदाहरण दिखाया गया है:

TypeScript

const request = {
    textQuery: query,
    fields: ['displayName', 'location', 'businessStatus'],
    includedType: '', // Restrict query to a specific type (leave blank for any).
    useStrictTypeFiltering: true,
    locationBias: map.getCenter(),
    isOpenNow: true,
    language: 'en-US',
    maxResultCount: 8,
    minRating: 1, // Specify a minimum rating.
    region: 'us',
};

const { places } = await Place.searchByText(request);
index.ts

ध्यान दें: TypeScript और Google Maps का इस्तेमाल करने के बारे में गाइड पढ़ें.

JavaScript

const request = {
    textQuery: query,
    fields: ['displayName', 'location', 'businessStatus'],
    includedType: '', // Restrict query to a specific type (leave blank for any).
    useStrictTypeFiltering: true,
    locationBias: map.getCenter(),
    isOpenNow: true,
    language: 'en-US',
    maxResultCount: 8,
    minRating: 1, // Specify a minimum rating.
    region: 'us',
};

const { places } = await Place.searchByText(request);
index.js

• textQuery पैरामीटर का इस्तेमाल करके, खोज के लिए कोई टेक्स्ट क्वेरी या फ़ोन नंबर तय करें.
• कैमल केस में एक या एक से ज़्यादा डेटा फ़ील्ड की कॉमा लगाकर अलग की गई लिस्ट तय करने के लिए, fields पैरामीटर (ज़रूरी है) का इस्तेमाल करें.
• सिर्फ़ तय किए गए टाइप के नतीजे पाने के लिए, includedType पैरामीटर का इस्तेमाल करें.
• टेक्स्ट खोज के नतीजों को किसी खास इलाके तक सीमित करने या नतीजों में किसी खास इलाके को प्राथमिकता देने के लिए, locationBias या locationRestriction का इस्तेमाल करें.

प्रॉपर्टी की पूरी सूची देखें.

अगर क्वेरी में कोई फ़ोन नंबर शामिल है, तो इलाके का पैरामीटर सेट किया जाना चाहिए. उदाहरण के लिए, अगर जापान में किसी जगह को खोजने के लिए फ़ोन नंबर का इस्तेमाल किया जाता है और अनुरोध करने वाला डोमेन jp है, तो आपको region पैरामीटर को 'jp' पर सेट करना होगा. अगर region को अनुरोध में शामिल नहीं किया जाता है, तो एपीआई डिफ़ॉल्ट रूप से अमेरिका ('us') के इलाके को चुनेगा.

नतीजे, Place ऑब्जेक्ट की सूची के तौर पर दिखाए जाते हैं. इनसे जगह की जानकारी पाई जा सकती है.

उदाहरण

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

TypeScript

let map: google.maps.Map;
let markers: Record<string, google.maps.marker.AdvancedMarkerElement> = {};
let infoWindow: google.maps.InfoWindow;

async function init() {
    const [{ Map, InfoWindow }, { ControlPosition }] = await Promise.all([
        google.maps.importLibrary('maps'),
        google.maps.importLibrary('core'),
    ]);

    const center = { lat: 37.4161493, lng: -122.0812166 };
    map = new Map(document.getElementById('map')!, {
        center,
        zoom: 11,
        mapTypeControl: false,
        mapId: 'DEMO_MAP_ID',
    });

    const textInput = document.getElementById('text-input') as HTMLInputElement;
    const textInputButton = document.getElementById(
        'text-input-button'
    ) as HTMLButtonElement;
    const card = document.getElementById('text-input-card')!;
    map.controls[ControlPosition.TOP_LEFT].push(card);

    textInputButton.addEventListener('click', () => {
        void findPlaces(textInput.value);
    });

    textInput.addEventListener('keydown', (event) => {
        if (event.key === 'Enter') {
            void findPlaces(textInput.value);
        }
    });

    infoWindow = new InfoWindow();
}

async function findPlaces(query: string) {
    const [{ Place }, { AdvancedMarkerElement }] = await Promise.all([
        google.maps.importLibrary('places'),
        google.maps.importLibrary('marker'),
    ]);

    const request = {
        textQuery: query,
        fields: ['displayName', 'location', 'businessStatus'],
        includedType: '', // Restrict query to a specific type (leave blank for any).
        useStrictTypeFiltering: true,
        locationBias: map.getCenter(),
        isOpenNow: true,
        language: 'en-US',
        maxResultCount: 8,
        minRating: 1, // Specify a minimum rating.
        region: 'us',
    };

    const { places } = await Place.searchByText(request);

    if (places.length) {
        const { LatLngBounds } = await google.maps.importLibrary('core');
        const bounds = new LatLngBounds();

        // First remove all existing markers.
        for (const id in markers) {
            markers[id].map = null;
        }
        markers = {};

        // Loop through and get all the results.
        places.forEach((place: google.maps.places.Place) => {
            const marker = new AdvancedMarkerElement({
                map,
                position: place.location,
                title: place.displayName,
            });
            markers[place.id] = marker;

            marker.addListener('gmp-click', () => {
                map.panTo(place.location!);
                updateInfoWindow(place.displayName!, place.id, marker);
            });

            if (place.location != null) {
                bounds.extend(place.location);
            }
        });

        map.fitBounds(bounds);
    } else {
        console.log('No results');
    }
}

// Helper function to create an info window.
function updateInfoWindow(
    title: string | Element | null,
    content: string | Element | null,
    anchor: google.maps.marker.AdvancedMarkerElement
) {
    infoWindow.setContent(content);
    infoWindow.setHeaderContent(title);
    infoWindow.open({
        map,
        anchor,
        shouldFocus: false,
    });
}

void init();
index.ts

ध्यान दें: TypeScript और Google Maps का इस्तेमाल करने के बारे में गाइड पढ़ें.

JavaScript

let map;
let markers = {};
let infoWindow;

async function init() {
    const [{ Map, InfoWindow }, { ControlPosition }] = await Promise.all([
        google.maps.importLibrary('maps'),
        google.maps.importLibrary('core'),
    ]);

    const center = { lat: 37.4161493, lng: -122.0812166 };
    map = new Map(document.getElementById('map'), {
        center,
        zoom: 11,
        mapTypeControl: false,
        mapId: 'DEMO_MAP_ID',
    });

    const textInput = document.getElementById('text-input');
    const textInputButton = document.getElementById('text-input-button');
    const card = document.getElementById('text-input-card');
    map.controls[ControlPosition.TOP_LEFT].push(card);

    textInputButton.addEventListener('click', () => {
        void findPlaces(textInput.value);
    });

    textInput.addEventListener('keydown', (event) => {
        if (event.key === 'Enter') {
            void findPlaces(textInput.value);
        }
    });

    infoWindow = new InfoWindow();
}

async function findPlaces(query) {
    const [{ Place }, { AdvancedMarkerElement }] = await Promise.all([
        google.maps.importLibrary('places'),
        google.maps.importLibrary('marker'),
    ]);

    const request = {
        textQuery: query,
        fields: ['displayName', 'location', 'businessStatus'],
        includedType: '', // Restrict query to a specific type (leave blank for any).
        useStrictTypeFiltering: true,
        locationBias: map.getCenter(),
        isOpenNow: true,
        language: 'en-US',
        maxResultCount: 8,
        minRating: 1, // Specify a minimum rating.
        region: 'us',
    };

    const { places } = await Place.searchByText(request);

    if (places.length) {
        const { LatLngBounds } = await google.maps.importLibrary('core');
        const bounds = new LatLngBounds();

        // First remove all existing markers.
        for (const id in markers) {
            markers[id].map = null;
        }
        markers = {};

        // Loop through and get all the results.
        places.forEach((place) => {
            const marker = new AdvancedMarkerElement({
                map,
                position: place.location,
                title: place.displayName,
            });
            markers[place.id] = marker;

            marker.addListener('gmp-click', () => {
                map.panTo(place.location);
                updateInfoWindow(place.displayName, place.id, marker);
            });

            if (place.location != null) {
                bounds.extend(place.location);
            }
        });

        map.fitBounds(bounds);
    } else {
        console.log('No results');
    }
}

// Helper function to create an info window.
function updateInfoWindow(title, content, anchor) {
    infoWindow.setContent(content);
    infoWindow.setHeaderContent(title);
    infoWindow.open({
        map,
        anchor,
        shouldFocus: false,
    });
}

void init();
index.js

CSS

/* 
 * Always set the map height explicitly to define the size of the div element
 * that contains the map. 
 */
#map {
    height: 100%;
}

/* 
 * Optional: Makes the sample page fill the window. 
 */
html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

#text-input-card {
    width: 25%;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    margin: 10px;
    padding: 5px;
    font-family: Roboto, sans-serif;
    font-size: large;
    font-weight: bold;
}

#text-input {
    width: 100%;
    padding: 10px;
    margin: 0;
    box-sizing: border-box;
}

#text-input-button {
    display: inline-block;
    margin-top: 0.5rem;
    width: auto;
    padding: 0.6rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #fff;
    background-color: #2563eb;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
    text-align: center;
}
style.css

HTML

<html>
    <head>
        <title>Text Search</title>

        <link rel="stylesheet" type="text/css" href="./style.css" />
        <script type="module" src="./index.js"></script>
        <script>
            // prettier-ignore
            (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: "GOOGLE_MAPS_API_KEY"
            });
        </script>
    </head>
    <body>
        <div id="text-input-card">
            <input
                type="text"
                id="text-input"
                placeholder="Search for a place" />
            <input type="button" id="text-input-button" value="Search" />
        </div>
        <div id="map"></div>
    </body>
</html>
index.html