hsp3.6dishのサンプルを自分のHP(Webで公開する/JavaScript)

hsp3dish.jsのサンプルをHPで公開する(ブロック崩し)
https://toshiaki1919.web.fc2.com/BlockDelete/block3.html

必要なファイル
・http://block3.data
・block3.html
・hsp3dish.js

実行手順1

実行手順2
https://toshiaki1919.web.fc2.com/BlockDelete/HSP3.5/HSP3.5_FC2.html

【Vroid】 Webでエ〇画像を読み込む (.vrm→gltf)

babyon-vrm-loader
https://virtual-cast.github.io/babylon-vrm-loader/

gltf-viewer (※ .vrm→.gltf変換)
https://gltf-viewer.donmccurdy.com/

インストールorアプリ(wiki)
https://site-builder.wiki/posts/27580

キャラクター制作ツール(Vroid Studio)　TIPS: ここでキャラクターがつくれるぞ！！
https://vroid.com/studio

備考:ゆっくり　(´・ω・`)
ホームページ --作成中--　(vroid)
https://toshiaki1919.web.fc2.com/HomePageUI3_FC2.html

キャンバスにボタンを付ける(簡易版/JavaScript)

<-- メインキャンバス-->
<canvas id="canvas" width="895px" height="440px" style="position:absolute;background:red;"> </canvas>

<-- canvas Button1-->
<canvas id="canvas" width="100px" height="100px" style="z-index; position:absolute; left:900px; background: yellow;" onClick="ff();"> </canvas>

<-------JavaScript------------->
<script>
const canvas = document.getElementById('canvas'); //キャンバスの取得
const ctx = canvas.getContext('2d'); //キャンバスの属性を扱えるようにする

//オブジェクト1
ctx.fillStyle = 'green';
ctx.fillRect(20, 10, 150, 100);

//オブジェクト2
ctx.fillStyle = 'blue';
ctx.fillRect(320, 10, 150, 100);

//実行ボタン
function ff()
{
ctx.fillStyle = 'blue'; //青色を取得
ctx.fillRect(320, 250, 150, 100); //ボックスの作成
}
</script>

キャンバスにボタンを付ける(簡易版)
https://toshiaki1919.web.fc2.com/canvas_button_simple.html