koobas.hobune.stream
Interactive 2D world map?
Hi, I tried to look around about this topic but I couldn't find what I needed, so here I am .
I'll try to make it simple, I would like to know if there is a way to create an interactive 2D world map in Unity. I need to have a map with clickable regions that upon click would change the map with a zoomed section (probably a different image, not a zoom in of the original). Using this map I made as an example: http://imageshack.us/a/img838/1127/ov52.jpg .
I need to be able to click on the "Arien Plains" region, after that I will have a map that represent that region alone, and if I click on one of the cities I would like to have another change to the city map. I hope this makes sense, if not I'll be happy to add more details (forgive me if my english is not perfect, that's not my first language ^^)
EDIT: So I managed to work at something. At this point I have one majon Issue. I managed to create custom meshes with the shapes of the regions, assign mesh colliders in unity with a script that change the map. The big problem now is that being the same plane with different texture the colliders will still be there, so if i click in a zoomed section i'll be teleported to another section. One way to avoid this I think would be using different planes, each one with a section of the zoomed map.
Are you familiar with scripting? Because there are many ways to achieve what you want but you need some knowledge of scripting.
One method is like the below answer says, using GUI functions. But I would suggest something else, using raycast and colliders. You can put your map on a plane and add various colliders for each region, then on click fire a raycast from the mouse position. Then when the raycast hit one of the collider the maincamera can change position to another map in the same scene.
I'm not very familiar with scripting but in this project I have also involved a friend of $$anonymous$$e who is a programmer so he probably could manage that better than me. Thanks for you reply ^^
This could be done in several ways, here's one suggestion.
Create a bunch of empty Game Objects with Box Colliders. Place these colliders on the parts of the map where you want interaction like this:
Create a script which listens for mouse clicks on the Game Object it is attached to:
public Texture2D zoomedInTexture;
void OnMouseDown() {
GameObject.Find("Map").GetComponent<Renderer>().material.mainTexture = zoomedInTexture;
}
Add this script to all colliders, and set the proper, zoomed in textures for each region on each script's zoomedInTexture variables in the Inspector. This also assumes you call the Game Object with the map on it "map".
This looks like a good method! The only thing I would like to change is the shape of the collider. $$anonymous$$aybe I could create custom meshes(lowest poly as possible) and then use a mesh collider and make the mesh invisible. Something like this Example Image
Something like this?
$$anonymous$$inda, but without the color selection part cause as you can see the map is going to be quite detailed. As you stated in your other reply using buttons is not accurate enough so I was thinking about using custom meshes created in maya and assign a mesh collider. Something like this http://puu.sh/46vWH.jpg
I don't get your complaint... the color map is for selection only! It won't be displayed anywhere. It's only used to deter$$anonymous$$e in which part your cursor is. You just sample the color of the "selection map" at your cursor position and you immediately know what section you're in. Again the selection map is a completely seperate texture.
I've edited my answer on the other question. Here's the sample selection texture for the map of the other question.
Hi, so from what your question say's you want to have an interactive map, which you can click on certain areas to move to a different map. Well the way I'd do this would be to have separate scenes for each new map area. So one world map scene, one town map scene etc. Then for example in the world map scene you can have a camera facing towards a plane with your map picture on it and then have a script which you can attach to the camera, this script would have GUI buttons which when pressed would transport you to the next requested scene. So if you clicked on the "Arien Plains" region from the world map you would be transported to a new scene which would have the new area's map on the plane and the same sort of thing can be done again but with one extra GUI button in the corner which would take you to the previous scene.
Hope this helps!
By the way you English is perfect!
Cheers Abbas
Edit: The Gui buttons would be placed on the scene wherever you would want them. So in this case on top of certain regions of the map.
It's a waste to use individual scenes for something as simple as showing a different image.
Each have it's own scene? yikes! that could get messy real quick in my opinion! I don't see a reason why he has to concern himself with retaining state of his game scene to show a different map. Neat idea though :)
Thanks for the answer! Is there a way to have the GUI buttons match certain areas? Or they are bound to be boxes?
Honestly i'm not sure, i think they are bound to boxes.
Oh actually you can re-size the buttons but then you would have to make them transparent.
One way you could do it is have a each click point be a gameobject that's overlaid on top of the map. Each of these would need a collider (to interact with the mouse click). Each of these would also need a simple script to keep track of which map to show. On the click, hide or fade the top level map and show the one referenced in the script.
Hope this helps.
Thanks for the reply! So basically with what you and neurological said the best options would be to play around with colliders on a plane with the map attached as a texture, if I understood correctly.
Exactly, I just posted an answer with screenshots and a script sample, it needs moderator verification though, should be here in a sec.
