{"action":"created","issue":{"url":"https://api.github.com/repos/istarkov/google-map-react/issues/457","repository_url":"https://api.github.com/repos/istarkov/google-map-react","labels_url":"https://api.github.com/repos/istarkov/google-map-react/issues/457/labels{/name}","comments_url":"https://api.github.com/repos/istarkov/google-map-react/issues/457/comments","events_url":"https://api.github.com/repos/istarkov/google-map-react/issues/457/events","html_url":"https://github.com/istarkov/google-map-react/issues/457","id":266125147,"number":457,"title":"Component directions","user":{"login":"Anchmil","id":32873022,"avatar_url":"https://avatars0.githubusercontent.com/u/32873022?v=4","gravatar_id":"","url":"https://api.github.com/users/Anchmil","html_url":"https://github.com/Anchmil","followers_url":"https://api.github.com/users/Anchmil/followers","following_url":"https://api.github.com/users/Anchmil/following{/other_user}","gists_url":"https://api.github.com/users/Anchmil/gists{/gist_id}","starred_url":"https://api.github.com/users/Anchmil/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Anchmil/subscriptions","organizations_url":"https://api.github.com/users/Anchmil/orgs","repos_url":"https://api.github.com/users/Anchmil/repos","events_url":"https://api.github.com/users/Anchmil/events{/privacy}","received_events_url":"https://api.github.com/users/Anchmil/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":4,"created_at":"2017-10-17T13:29:53Z","updated_at":"2018-02-10T12:46:40Z","closed_at":null,"author_association":"NONE","body":"Hello! Can you tell me how can I create a component directions like this [https://developers.google.com/maps/documentation/javascript/examples/directions-waypoints?hl=ru](https://developers.google.com/maps/documentation/javascript/examples/directions-waypoints?hl=ru)\r\nI can not understand how to display the route on a map. Please help someone.\r\nNow my component looks\r\n```\r\ndirectServ = () => {\r\n\t\tgoogleMapLoader(bootstrapURLKeys)\r\n\t\t.then((maps) => {\r\n\t\t\tconst directionsService = new maps.DirectionsService();\r\n\t\t\tconst directionsDisplay = new maps.DirectionsRenderer();\r\n\t\t\tdirectionsService.route({\r\n\t\t\t\torigin: 'Boston, MA',\r\n\t\t\t\tdestination: 'Vancouver, BC',\r\n\t\t\t\ttravelMode: 'DRIVING'\r\n\t\t\t}, (response, status) => {\r\n\t\t\t\tif (status === 'OK') {\r\n\t\t\t\t\tdirectionsDisplay.setDirections(response);\r\n\t\t\t\t\tconsole.log(response.routes[0])\r\n\t\t\t\t} else {\r\n\t\t\t\t\twindow.alert('Directions request failed due to ' + status);\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t})\r\n\t};\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t<button type=\"button\" onClick={this.directServ}>directionClick</button>\r\n\t\t)\r\n\t}\r\n```"},"comment":{"url":"https://api.github.com/repos/istarkov/google-map-react/issues/comments/364649394","html_url":"https://github.com/istarkov/google-map-react/issues/457#issuecomment-364649394","issue_url":"https://api.github.com/repos/istarkov/google-map-react/issues/457","id":364649394,"user":{"login":"henriquemattos","id":2782214,"avatar_url":"https://avatars2.githubusercontent.com/u/2782214?v=4","gravatar_id":"","url":"https://api.github.com/users/henriquemattos","html_url":"https://github.com/henriquemattos","followers_url":"https://api.github.com/users/henriquemattos/followers","following_url":"https://api.github.com/users/henriquemattos/following{/other_user}","gists_url":"https://api.github.com/users/henriquemattos/gists{/gist_id}","starred_url":"https://api.github.com/users/henriquemattos/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/henriquemattos/subscriptions","organizations_url":"https://api.github.com/users/henriquemattos/orgs","repos_url":"https://api.github.com/users/henriquemattos/repos","events_url":"https://api.github.com/users/henriquemattos/events{/privacy}","received_events_url":"https://api.github.com/users/henriquemattos/received_events","type":"User","site_admin":false},"created_at":"2018-02-10T12:46:40Z","updated_at":"2018-02-10T12:46:40Z","author_association":"NONE","body":"@itsmichaeldiego sorry took me so long to see your comment and thanks for your suggestion. I'm currently wondering how to place the route on a map. Right now my app is a bus locator where I have several vehicles being tracked by GPS so I auto-refresh the pins for buses to get update the coordinates. As for the bus stations, they do not move (duh! haha), so no auto-refresh. \r\n\r\nI would like to create a route between the bus stations so that the buses pins would be \"driving their way to the next stop\". Any tip? I don't know what to do after setting the param \"yesIWantToUseGoogleMapApiInernals\".\r\n\r\nRight now this is my config where referencePointsList is an array of buttons with icons to flag as pin/map marker. The same for vehiclesInRoute:\r\n```\r\n<GoogleMapReact\r\n        bootstrapURLKeys=\"myFancySecretKey\"\r\n        defaultCenter={this.mapCenter}\r\n        center={this.props.mapCenter}\r\n        defaultZoom={this.mapZoom}\r\n        zoom={this.props.mapZoom}\r\n>\r\n    {this.referencePointsList}\r\n    {this.vehiclesInRoute}\r\n</GoogleMapReact>\r\n```"}}
{"actor":{"display_login":"henriquemattos"}}