Mapa do gry RTS

[Alanon]

Witam, jestem w trakcie tworzenia gry strategicznej (dla nauki). I napotkałem pewien problem.

 

Otóż chciałbym aby mapa miasta (podgląd wioski) był przesuwany za pomocą myszy i to zrobiłem za pomocą Canvas. 

Problem tkwi w tym że chciałbym aby przesuwanie blokowało się w taki sposób aby nie było widać tła strony (body).

 

Chodzi o coś takiego jak tu:

 

 

Nie do końca wiem jak to zrobić. Za pomoc z góry dziękuję.

[PanTobi]

Masz wymiary okna?...

 

var Okno_szerokosc = window.innerWidth;

var Okno-wysokosc = window.innerHeight;

 

teraz jak masz wymiary okna nie pozwól aby pozycja kamery była:

1) Większa niż szerokość mapy - 50% szerokości okna

2) Mniejsza niż 50% szerokości okna

3) Większa niż wysokość mapy - 50% wysokości okna

4) Mniejsza niż 50% wysokości okna

 

W ten sposób zanim narysujesz nowy frame zawsze kamera będzie w max. pozycji na x+ x- y+ y-

 

 

Przy okazji przyda ci się:

window.addEventListener('resize', NazwaFunkcji, false);

 

W ten sposób unikniesz problemu z zmianą rozmiaru okna przez użytkownika, mam na myśli

CTRL + WHEEL które zoomuje okno jeśli chcesz możesz pozwolić użytkownikowi na zoomowanie

 

Grafiki i wszystko zostanie odpowiednio zeskalowane przez Canvas lecz jeśli będziesz chciał

aby grafiki zawsze miały taki sam rozmiar na ekranie nie ważne jak user oddali to będziesz musiał dodatkowo już je skalować

 

w miejscu <Nazwa Funkcji> musisz podać funkcję która ma się wywołać jak user zmieni rozmiar okna np.

function NazwaFunkcji(){
Canvas.width = window.innerWidth;

Canvas.height = window.innerHeight;
}

 

w ten sposób Canvas zawsze będzie posiadać max, rozmiar okna przeglądarki

Opcja ta działa również jeśli użytkownik "oderwie" okno z topu i zmieni rozmiar borderów okna

 

 

Anno Online jest grą 2D więc to wystarczy do trzymania kamery w ryzach :)...

 

//Edit:

Nie rozumiem czemu Online zrobili na podstawie Anno 1404...

znaczy.. jest to dobra gra ale osobiście wolę 2205 :D...

 

 // Tu chciałem dodać zdjęcie z mojego Anno 1404 ale mam jakiś durny błąd -200 na MPC xD

Google: https://drive.google.com/file/d/1d42w2QNtT5cQ-QiQwQ_TQa2z58WfdAyQ/view?usp=sharing

 

Jak któryś z Adminów chce możecie pobrać obrazek i wrzucić na MPC wtedy będzie

dostępne wiecznie... ja nie obiecuję że nie skasuje go za jakiś czas xD