2016-04-23 12 views
0

Ich möchte Carcassonne-ähnliches Spiel mit Pixi js erstellen. Jede Kachel ist ein separates Bild und ich muss einige Objekte auf diesem Bild wie Straßen, Städte usw. erkennen. Ist es möglich, Pixi für diesen Zweck zu verwenden? Wenn ja, welchen Ansatz muss ich verwenden? Ich habe es gegoogelt, kann aber nichts Nützliches finden.Pixi js: erkennen Objekte auf Bild

+0

Sie bauen also ein rundenbasiertes Strategiespiel auf. Ich baue gerade eine Engine für Turn-basierte Strategiespiele: ttps: //github.com/Hachitus/FlaTWorld, aber es ist noch in einem ziemlich instabilen Stadium und in der Entwicklung. Sie können eine Testkarte hier sehen: https://warmapengine.level7.fi/tests/manualStressTest.html (akzeptieren Sie die Verbindung, da es https ist und kein "gültiges" Zertifikat installiert ist) drücken Sie einfach Start und sehen. Es gibt auch andere Implementierungen, die in diesem Stadium besser zu Ihnen passen. Ich empfehle, zumindest PIXI-Foren zu überprüfen: http://www.html5gamedevs.com/forum/15-pixijs/ – Hachi

+0

Auch Ivan poelyshev hat einige Tilemaps in PIXI getan: https://github.com/ivanpopelyshev, diese könnten besser passen für dein Projekt. Und auch Sie können Phaser (phaser.io) überprüfen, wenn es für Sie besser funktioniert. Obwohl ich nicht der Meinung bin, dass die normalen Web-Engines viel nützliches zur rundenbasierten Strategie liefern, weshalb ich auch meine eigene Engine implementiere. – Hachi

Antwort

1

Zunächst einmal: Natürlich können Sie pixi.js für diesen Zweck verwenden. Aber Sie sollten bedenken, dass Pixi keine Gaming-Engine ist. Es ist nur ein Renderer, also müssen Sie viele Berechnungen wie Kollisionen und Positionierung für Ihr Spiel selbst durchführen.

Ein möglicher Ansatz (ich bin sicher, es gibt jede Menge andere Möglichkeiten, es zu tun):

  1. Sie sollten alle von Ihnen Bilder
  2. erstellen Container Vorspannung: var myContainer = new PIXI.Container();
  3. Erstellen von Texturen für In var texture = new PIXI.Texture(yourImageStoringObject)
  4. die Texturen Sie Container: Ihre Bilder myContainer.addChild(texture);
  5. erstellen einen zusätzlichen Behälter Ihre betroffenen Gebieten halten (Straßen, Städte usw.) und fügen Sie diesen Container erneut dem Hauptcontainer hinzu.
  6. Erstellen Sie einige pixi geometrics wie Rechtecken (new PIXI.Rectangle(x,y,w,h)) oder Kreise repräsentieren Sie Bereiche treffen und in Ihren Hit-Area-Container

Gerade jetzt meine Antwort ist ein bisschen eines abstrakter Ansatz. Ich rate nur, was dir helfen könnte, dein Projekt zu starten. Versuchen Sie, einige Grundlagen herauszufinden und um Hilfe zu bitten. Wenn Sie einige Code-Stücke zur Verfügung stellen könnten, ist es viel einfacher zu helfen! :)

+0

"Es ist nur ein Renderer" - ja, jetzt benutze ich phaserjs. Meine erste Wahl wurde mit dieser Seite https://html5gameengine.com/ gemacht – mtkachenko