pinned notes

  • numpy の import は pygame の直後に行うようにした。
  • browserで勝手に拡大されて画像がぼけるので、大きめの画面サイズで考える。
  • pygbagのヘルプを見る方法 pygbag --help 'foldername'
  • iOS の場合、なぜか ReadyToStartのボタンから大きく外れたエリアを押さないと開始しない https://github.com/pygame-web/pygbag/issues/138#issue-2011645179

2024-01-15 numpy sample

  • https://jamad.github.io/wasm/2024-01-15-numpy/
  • (問題とその解決) 当初、 実行しても何故か、何も起こらなかった(pygbag のコマンドでローカルサーバでのテストの時から)
    • 結局、#import tkinter as tk のようにtkinter を完全コメントアウトし、import を下記の順序にしたらコードが実行された
    • image

2024-01-02 未完 movie size changer

2023-12-23

  • https://jamad.github.io/wasm/2023-12-23-mandelbrot/
  • あれ?まだ黒いな .py で実行した時は、下記のように表示されるのに。もしかしたらpygame.surfarray.pixels3d(screen)が良くないのか?
  • ちなみに、下記はpygame前のmatplotでの事前調査
  • image
  • code
import pygame
import numpy as np
import matplotlib.pyplot as plt

def mandelbrot(c, max_iterations=30):
    z = 0
    for i in range(max_iterations):
        if 2<abs(z):return i
        z=z*z+c
    return max_iterations 

def mandelbrot_set(size=512):
    x=np.linspace(-2    ,1  ,size)
    y=np.linspace(-1.5  ,1.5,size)
    mset=np.zeros((size,size))
    for i in range(size):
        for j in range(size):
            c=complex(x[j],y[i])
            mset[i,j]=mandelbrot(c)
    return mset

plt.imshow(mandelbrot_set(),cmap='hot')
plt.show()
  • https://jamad.github.io/pygbag_test/
  • image

2023-12-19 メインを別ファイル化して作業しやすくした (main.py は触らず、mygame.pyだけを更新)

更にモバイルで 指でタップして反応を得た! player_pos = pygame.mouse.get_pos() で指の位置ゲット

2023-12-18

2023-12-17 更新

pygbag を使わなくても、python code を .html内部に記述すれば実行はできる (速度が十分かは未検証 更に不要な情報が見え隠れするのはNG )

pygbag (wasm_webassembly) でpygameをdeploy

|playable pygame at https://jamad.github.io/wasm/simplest_snakegame/|image| |-|-|

pygbag 前のコード変更

作業のステップ 補足
main.py をファイル名にしてpygame作成 original pygame image
コードの加工が終わったら pygbagのステップへ進む  diff between before and after
加工の為のポイント asyncio を import する
mainloop の構造を下記のように変更する
async def main():
  while 1: # main loop
    ...
    await syncio.sleep(0)

asyncio.run(main())

pygbag

作業のステップ 補足
pygbag コマンドの実行 image
ローカルでの動作を確認 image
必要なファイルはbuildフォルダ内に生成されている image
必要に応じてファイルの階層を変更してgithubにcommitすれば完了 image