質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
WebGL

WebGL(ウェブジーエル)は、ウェブブラウザで 3次元コンピュータグラフィックスを表示させるための標準仕様です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

解決済

webGL系の技術を使いreactでノベルゲームを開発したいが、どのライブラリが標準的なのかわからない。

hood
hood

総合スコア0

WebGL

WebGL(ウェブジーエル)は、ウェブブラウザで 3次元コンピュータグラフィックスを表示させるための標準仕様です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

1回答

0評価

1クリップ

2561閲覧

投稿2019/09/05 02:41

編集2022/01/12 10:58

###webGL系の技術を使いreactでノベルゲームを開発したいが、どのライブラリが標準的なのかわからない。
タイトル通りです。
すでにノベルゲームを作ってはいたですが、いろいろと限界を感じてしまい改良のためwebGLの技術を取り入れようと思いました。

最終的にはボラギノールタウンの2D版のようなものを作りたいと思っています。(私が作ったノベルゲームの試作サイトを見ていただけるとわかりやすいかと思います。)

しかしwebGL系のライブラリにはいろいろとあって何がスタンダードなのかわかりません。さらにreact自体あまり他のライブラリと相性が悪いらしく、createjsなどもいじってみたのですが機能しませんでした。

ならばwebGLをそのまま使おうかとも思いましたが、この技術自体結構ニッチで私にはきついかなという所感でした。(それでも腰を据えて開発していこうと思っているので、webGLを勉強するのが結局一番ならやってもいいかなとも思っています。)

長々と書いてきましたが、手探りの状態です。
些細なことでもいいので、アドバイスいただけたら幸いです。

--
追記
Q-なぜWebGLを使おうと思ったか。

正確にいえばreactでcanvasを使い画像を描画するのに、必要な知識を探しています。書き方が悪かったです。

別にWebGLじゃなくてもいいのですがボラギノールタウンのサイトを調べていると、一枚のcanvasに町が描かれているようなのでWebGLじゃないのかな?と勝手に解釈しました。もっといい方法があるのなら教えていただきたいです。この質問を閉じさせてもらいます。

Q-具体的に何が上手くいっていないのか。

端的にいえば私がとっている手法では、描画した画像を画面幅に合わせられないことが問題です。
私は以下のようなcss-in-jsでcanvasの比率を保ち、レスポンシブデザインを実現しようとしています。

export const CanvasContainer = styled.div` position: relative;  background-color: #200050; padding-top: 56.25%; `;

しかしこれでは画面幅に合わせることができません。(普通のhtmlファイルにおけるcreatejsでは上手くいきました。しかしこれをreactに移植するとなぜか動きませんでした。前回の質問参照)

なので別途違った手法をとる必要があるのではないかと考えました。それでwebGLかなと思いました、

繰り返しになりますが、WebGLじゃなくてもいいのでreactではどんな画像描画に関してどんな技術が注目されているか、どんなライブラリが標準的なのか知りたいです。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

t_obara
t_obara

2019/09/05 03:15

「色々と限界を感じてしまい」をもっと詳しく書かないと、この質問を見ている方はなぜWebGLなのかがさっぱり理解できません。
m.ts10806
m.ts10806

2019/09/05 04:23

1万字投稿できるのでこの文量で「長々と」とは感じませんが、 色々やってみて「なんかうまくいかなかった」で諦めているだけの状態では中々すすめようにもすすめづらいと思います。
hood
hood

2019/09/05 05:43

お二人ともコメントありがとうございます。 >「色々と限界を感じてしまい」をもっと詳しく書かないと 確かにそうですね。なぜWebGLを使おうと思ったのか具体的な部分も追記しようと思います。 >色々やってみて「なんかうまくいかなかった」で諦めているだけの状態 確かにそうですね。具体的に何が上手くいっていないのか追記しようと思います。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

WebGL

WebGL(ウェブジーエル)は、ウェブブラウザで 3次元コンピュータグラフィックスを表示させるための標準仕様です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。