Custom Members Map

gorillaman
New Member

Posts: 45

Custom Members Map Oct 4, 2017 5:15:24 GMT -8

Post by gorillaman on Oct 4, 2017 5:15:24 GMT -8

I have a google map inserted into the members page showing general locations of members.

I know I can add it to the forum wrapper and have the map show up on all pages but...

How can I have the map show up in an individuals profiel when someone clicks on the members profile (name)

So that the map shows the individual members location, not everyones?

Do I have to add a custom label in the profile and somehow link that to the map?

Sorry but I am a little bit out of my element on this one.

gorillamansgarage.boards.net/members

- 2016 FLTRU -

Ulises
Pro Member

Posts: 4,881
Mini-Profile Theme: Ulises Weirdo

Custom Members Map Oct 13, 2017 10:31:22 GMT -8

Post by Ulises on Oct 13, 2017 10:31:22 GMT -8

Hey gorillaman .

I don't think that is possible without adding something to the google maps map code that you are getting. Unfortunately I am not familiar with the Google Maps API. Out of curiosity, how did you get that code to show them all like that? It might be possible to do something with Javascript together with the a custom profile field, as you say.

Something like this might work and is install-able on your forum since its just HTML and JS (taken from here: developers.google.com/maps/documentation/javascript/examples/marker-simple):

SPOILER: Click to show

<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <title>Simple markers</title> <style> /* 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; } </style> </head> <body> <div id="map"></div> <script> function initMap() { var myLatLng = {lat: -25.363, lng: 131.044}; var map = new google.maps.Map(document.getElementById('map'), { zoom: 4, center: myLatLng }); var marker = new google.maps.Marker({ position: myLatLng, map: map, title: 'Hello World!' }); } </script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"> </script> </body> </html>

Though the HTML code will need a little tweaking. It could make a nice plugin actually. Could probably crank it out today before I leave. :P

Last Edit: Oct 13, 2017 10:44:02 GMT -8 by Ulises

Ulises
Pro Member

Posts: 4,881
Mini-Profile Theme: Ulises Weirdo

Custom Members Map Oct 13, 2017 12:16:56 GMT -8 P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ likes this

Post by Ulises on Oct 13, 2017 12:16:56 GMT -8

Okay, made this super barebones plugin that will ease the above process for ya. Attached: Google Maps Location in User Profile.pbp (13.17 KB)

and a preview of what it looks like:

It requires quite a bit of setup, but all the things you need to know are in the Things You Need to Know tab of the plugin:

After you have set that up, you can test it by filling out the Latitude and Longitude values by going to your profile then Edit Profile > Personal (tab) and scrolling to where you see this (don't forget to click save!):

Any questions let me know. :) You'll need to find the latitude and longitude of where you are from Google Maps, of course.

Last Edit: Oct 13, 2017 12:43:41 GMT -8 by Ulises: boom

gorillaman
New Member

Posts: 45

Custom Members Map Oct 14, 2017 6:39:28 GMT -8 via mobile

Post by gorillaman on Oct 14, 2017 6:39:28 GMT -8

Excellent. I will look at it tonight. Thanks. I will let you know.

***

I started reading about the API keys etc... WOW did I get lost.

Presently I manually insert the members onto the map and insert the page to the forum. But I was on another forum that had it as described above. But that forum imploded.... hence this one is started.

Last Edit: Oct 14, 2017 10:27:09 GMT -8 by gorillaman

- 2016 FLTRU -

P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓
v6 Beta Tester

Using My Talents Elsewhere

Posts: 3,314

Custom Members Map Oct 17, 2017 4:57:14 GMT -8 Ulises likes this

Post by P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ on Oct 17, 2017 4:57:14 GMT -8

Oct 14, 2017 6:39:28 GMT -8 gorillaman said:

Excellent. I will look at it tonight. Thanks. I will let you know.

***

I started reading about the API keys etc... WOW did I get lost.

Presently I manually insert the members onto the map and insert the page to the forum. But I was on another forum that had it as described above. But that forum imploded.... hence this one is started.

I embedded a google map with a custom plugin of mine once, it's been a headache through the years every time they change something. Once it was the api changed, once it was chromes iframe security. And one time I don't remember what the problem was exactly. But it is cool.

Proboards V6: We won't tell you what your getting cause we don't know what works yet. -Proboards Marketing
We are making forums so responsive it can slap you across the face.
You can't believe it's not v5.
The only thing we have left to fear is errrrr itself.
We came in like a wrecking ball, then we built you a better house.
So new. Such Pheonix. Wow.
Plugin Compilation

Ulises
Pro Member

Posts: 4,881
Mini-Profile Theme: Ulises Weirdo

Custom Members Map Oct 20, 2017 8:51:01 GMT -8

Post by Ulises on Oct 20, 2017 8:51:01 GMT -8

gorillaman All you need to do is sign up for a free API key from google:

-Sign into your google account
-Go here: developers.google.com/maps/documentation/javascript/
-You should see the get a key button:

-Follow the steps in the pop-up to get a key (you can name it after your forum or it can be anything)
-Paste that key in the plugin settings.

Once that is done you can fill-in your latitude and longitude for your location.

gorillaman New Member Posts: 45 gorillaman inherit Male 248486 0 Oct 22, 2023 2:53:26 GMT -8 gorillaman 45 New Member August 2017 gorillaman	Custom Members Map Nov 2, 2017 3:12:40 GMT -8 Ulises likes this Select Post Deselect Post Link to Post Member Give Gift Back to Top Post by gorillaman on Nov 2, 2017 3:12:40 GMT -8 Sorry I have not got back at this yet. Family stuff... I will try this weekend. I really appreciate all your efforts. Thank you. I will let you know how it works out.
	*- 2016 FLTRU -*

Post by gorillaman on Oct 4, 2017 5:15:24 GMT -8

Post by Ulises on Oct 13, 2017 10:31:22 GMT -8

Post by Ulises on Oct 13, 2017 12:16:56 GMT -8

Post by gorillaman on Oct 14, 2017 6:39:28 GMT -8

Post by P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ on Oct 17, 2017 4:57:14 GMT -8

Post by Ulises on Oct 20, 2017 8:51:01 GMT -8

Post by gorillaman on Nov 2, 2017 3:12:40 GMT -8