Articles → MICROSOFT BOT FRAMEWORK → Open Google Map In Microsoft Bot Framework

Open Google Map In Microsoft Bot Framework






Generate API Key




  1. Go to the URL - https://developers.google.com/maps/documentation/embed/get-api-key
  2. Scroll down and you will get the instructions.
    3. Picture showing the steps for creating the API key
    Click to Enlarge

  3. Click on the "Go to the Credentials Page" button.
  4. On the credentials page, you will see the list of the projects.
    5. Picture showing the list of projects in Credentails screen
    Click to Enlarge

  5. Click on any project to go to the details screen.
  6. In the details screen, click on "+ Create Credentials" → "API Key".
    7. Picture showing the menu option for API key generation
    Click to Enlarge

  7. A popup window will appear with the generated API key.
    8. Picture showing a popup window with generated API key
    Click to Enlarge

  8. Copy the key and close the window.

Code In Bot Project




var images = new List <CardImage> ();
HeroCard _card = new HeroCard();
string apiKey = "<your_generated_api_key>";
string storeAddress = "Banaras";
images.Add(
  new CardImage($"https://maps.googleapis.com/maps/api/staticmap?zoom=17&scale=2&size=600x300&maptype=roadmap&key={apiKey}&format=png&visual_refresh=true&markers=size:mid%10Ccolor:0xff0000%7Clabel:1%7C" + storeAddress));

var buttons = new List < CardAction > ();

buttons.Add(new CardAction(ActionTypes.OpenUrl, "Directions", value: $ "https://www.google.co.in/maps/dir/{"
  "}/{storeAddress}"));

_card.Buttons = buttons;
_card.Images = images;

await turnContext.SendActivityAsync(MessageFactory.Attachment(_card.ToAttachment()), cancellationToken);



Output


Picture showing the Google map on the chat bot
Click to Enlarge


Posted By  -  Karan Gupta
 
Posted On  -  Thursday, February 11, 2021

Query/Feedback


Your Email Id
 
Subject
 
Query/FeedbackCharacters remaining 250