Como posso criar um grande fundo de espaço que se repete para um jogo de rts. Também quero ter nebulosas complexas e campos de poeira, mas como as unidades terão muito espaço para explorar, não posso ter um jpeg de 120000px por 1200000px, portanto, desejo repetir a imagem, mas não alterar linhas entre segmentos.
Estou usando isso com o quadro Babylon da Microsoft para a tela GL da web
Respostas:
Use rolagem de paralaxe. Tem várias camadas de fundo que rolam com diferentes frações da velocidade do ponto de vista principal. Quanto mais baixa a camada, mais lenta ela rola. Essa não é apenas uma ótima maneira de fornecer uma ilusão de profundidade, mas também faz com que os planos de fundo pareçam menos repetitivos porque os objetos nas diferentes camadas aparecerão em diferentes composições, pois as camadas não estão sincronizadas.
crie seus fundos de forma processual. Em vez de um imenso gráfico de fundo, tenha vários elementos menores diferentes e coloque todos eles várias vezes aleatoriamente em todo o mundo do jogo.
A propósito: não use JPEG quando puder evitá-lo. É um formato com perdas que perde mais qualidade sempre que você o modifica e salva, é altamente otimizado para fotografia e não suporta transparência. Use um formato sem perdas com canal alfa como PNG. A única boa razão seria quando sua imagem de origem estiver disponível apenas em JPEG (a NASA publicou muitas fotos agradáveis de astronomia, todas de domínio público) e você deseja fazer nenhuma modificação nelas.
fonte
Uma maneira de criar um fundo infinito para um jogo 2D é o seguinte:
Espero que isto ajude.
fonte
Camadas funcionam bem.
Aqui estão algumas matemáticas:
Suponha que você tenha uma via férrea mal feita de forma que coisas do tipo
__ __
notem a diferença entre eles. Quando a roda rola sobre eles, faz um pequeno entalhe (entalhe minúsculo).Se o comprimento da pista for
l
e a roda tiver raior
,2pi r
será a circunferência da roda,ration=l/(2pi r)
se a proporção for 10,25, a roda terá um entalhe a cada trimestre, à medida que percorre um longo tempo.É a maneira mais fácil de explicar os espaços de cobertura.
Então, suponha que você tenha duas imagens; se uma tiver essa proporção de um quarto, você obterá um padrão de 4 fases; ele será repetido após 4 blocos. Suponha que você tenha 1 fundo principal e 2 sobreposições, com m e n fases. Então o padrão será repetido após m * n blocos.
Embora isso não importe muito, o padrão ficará melhor se os números forem co-primos, o maior divisor comum é 1. Por exemplo, suponha que tenhamos algo da fase 6 e algo da fase 4, todas as outras fases "se alinharão " num sentido.
Você pode usar esta técnica (especialmente com partículas e outras coisas) para criar várias coisas "únicas" com muito pouco esforço.
De volta à roda do trem, se a proporção for irracional, os entalhes cobrirão a roda! Mas isso realmente não importa.
fonte
Aqui está outra idéia que parece estar faltando:
No caso de fundos de longa distância, como caixas de céu, as camadas Parallax não são realmente boas. Pense nas estrelas, por exemplo, ao caminhar na Terra ou, melhor ainda, durante a noite, todas as estrelas se movem juntas, embora saibamos que elas estão centenas ou pensamentos a anos-luz de distância uma da outra. O problema é que eles estão muito longe para que possamos perceber suas distâncias. Tudo isso disse que ainda queremos uma textura muito grande (digamos 120k * 120k), que seja desenhada com nosso poder computacional limitado (que pode lidar com 8k * 8k no máximo). Como usar várias camadas de paralaxe, você deve criar diferentes texturas, cada uma com diferentes tipos de detalhes. Por exemplo, uma representa galáxias, outra é um monte de estrelas, etc. Mas desta vez, em vez de movê-las com velocidades diferentes, elas devem diferir em seus tamanhos. Aqui está um exemplo: considere usar 3 texturas, um é 2048 * 2048, outro é 729 * 729 e o terceiro é 625 * 625. Como esses números são coprime entre si, ao combinar essas 3 texturas em 3 camadas, deve-se mover lcm (2048.729.625) = 764M pixels da origem para ver a mesma coisa sendo desenhada, o que parece meio infinito. Na verdade, você pode adicionar outras camadas ou alterar o tamanho de cada textura e sempre terá um resultado tão grande quantomúltiplo menos comum de tamanhos de textura.
fonte
Parece ser um trabalho para um sombreador de pixels processual.
As vantagens sobre o uso de uma imagem são:
Uma simples pesquisa na web mostra esse shader http://casual-effects.blogspot.com.au/2013/08/starfield-shader.html, que se parece com o que você está procurando.
Não sou especialista em WebGL, mas de acordo com esta página , parece que ele usa a linguagem GLSL comum (essa é a linguagem C-Like usada pelas placas gráficas para programar shaders). Isso significa que você provavelmente terá pouca ou nenhuma alteração para fazê-lo funcionar.
No entanto, você pode tentar começar com um sombreador mais básico para entender como ele funciona.
Esta página do blog lista todas as etapas para implementar um shader no WebGL. Parece um bom lugar para começar.
Outro bom lugar para encontrar exemplos maravilhosos de shader é https://www.shadertoy.com/
fonte
Você pode cortar seu grande jpeg em pequenos segmentos e colocá-los (parte visível), nem é necessário armazená-lo na memória o tempo todo.
E, como nos jogos antigos, alguns 'tiles' podem se repetir. Isso foi uma solução comum para o console NES, que até foi suportado por hardware.
fonte