How to draw a city map in the game?

foxi13

Newbie
Game Developer
Dec 21, 2020
54
62
How to draw a city map in the game?

Are there any options to do something similar?


Map_Day.jpg
 

lordparcival

Member
Nov 29, 2020
138
214
I asked myself the same thing and stumbled across some guides for it. Most likely imagemaps is the way to go here.


Edit: Or are you specifically asking about creating a Map itself not about how to implement it?
 
Last edited:

79flavors

Well-Known Member
Respected User
Jun 14, 2018
1,607
2,256
If you're looking for advice on and how it can be used with navigation maps... this thread talks about it a bit and I created a sample project which shows how to use a simple map in RenPy.

The implementation is that you take your base map and cut out images from it as hotspots. You save those images of just one building with a transparent background (anything that isn't transparent is clickable) and then use that as your "idle" image. You can save a 2nd copy of the same image and alter it somehow to use as a "hover" image. Hover images are used to highlight that you've moved your mouse over something that is clickable... so you can change it's color or put a border around it or anything else you can think up. Each map usually has one base image and 2 idle+hover images per clickable zone. So a map with 5 clickable buildings is going to need 11 images.

Obviously, to cut out sections of the image and create those transparent idle/hover images you'll need to use a graphics editor like Photoshop or .

However, if you're asking "how do I create a cityscape picture?". Well, that's not really a programming thing. It's just a picture and that picture can be created in any way. Maybe just google search " ", " " or " ". I've seen people use SimCity or Cities Skylines screenshots. There are also a lot of free image sites that offer isometric 3d city buildings for download. I think the last time I messed around with images like this, I used (see ). If I were creating a medieval world, I might even "borrow" screenshots from the game . It really depends on your game and art style.

Alternatively, you could always go to the Recruitment and Services forum here on F95 and commission someone to create a map for you.
 
Last edited:

foxi13

Newbie
Game Developer
Dec 21, 2020
54
62
If you're looking for advice on and how it can be used with navigation maps... this thread talks about it a bit and I created a sample project which shows how to use a simple map in RenPy.

The implementation is that you take your base map and cut out images from it as hotspots. You save those images of just one building with a transparent background (anything that isn't transparent is clickable) and then use that as your "idle" image. You can save a 2nd copy of the same image and alter it somehow to use as a "hover" image. Hover images are used to highlight that you've moved your mouse over something that is clickable... so you can change it's color or put a border around it or anything else you can think up. Each map usually has one base image and 2 idle+hover images per clickable zone. So a map with 5 clickable buildings is going to need 11 images.

Obviously, to cut out sections of the image and create those transparent idle/hover images you'll need to use a graphics editor like Photoshop or .

However, if you're asking "how do I create a cityscape picture?". Well, that's not really a programming thing. It's just a picture and that picture can be created in any way. Maybe just google search " ", " " or " ". I've seen people use SimCity or Cities Skylines screenshots. There are also a lot of free image sites that offer isometric 3d city buildings for download. I think the last time I messed around with images like this, I used (see ). If I were creating a medieval world, I might even "borrow" screenshots from the game . It really depends on your game and art style.

Alternatively, you could always go to the Recruitment and Services forum here on F95 and commission someone to create a map for you.
Thank you
 

FluffyStudio

Well-Known Member
Donor
Game Developer
May 23, 2017
1,035
2,356
If you're looking for advice on and how it can be used with navigation maps... this thread talks about it a bit and I created a sample project which shows how to use a simple map in RenPy.

The implementation is that you take your base map and cut out images from it as hotspots. You save those images of just one building with a transparent background (anything that isn't transparent is clickable) and then use that as your "idle" image. You can save a 2nd copy of the same image and alter it somehow to use as a "hover" image. Hover images are used to highlight that you've moved your mouse over something that is clickable... so you can change it's color or put a border around it or anything else you can think up. Each map usually has one base image and 2 idle+hover images per clickable zone. So a map with 5 clickable buildings is going to need 11 images.

Obviously, to cut out sections of the image and create those transparent idle/hover images you'll need to use a graphics editor like Photoshop or .

However, if you're asking "how do I create a cityscape picture?". Well, that's not really a programming thing. It's just a picture and that picture can be created in any way. Maybe just google search " ", " " or " ". I've seen people use SimCity or Cities Skylines screenshots. There are also a lot of free image sites that offer isometric 3d city buildings for download. I think the last time I messed around with images like this, I used (see ). If I were creating a medieval world, I might even "borrow" screenshots from the game . It really depends on your game and art style.

Alternatively, you could always go to the Recruitment and Services forum here on F95 and commission someone to create a map for you.
I wish I found your post so much sooner. Thanks for the effort.
 
  • Like
Reactions: 79flavors