From e974416760e4a562a26a8320fab175b54abc28bb Mon Sep 17 00:00:00 2001
From: "xiao.xiong" <xiao.xiong@keymantech.cn>
Date: Sat, 11 Oct 2025 18:33:14 +0800
Subject: [PATCH] update

---
 pnpm-workspace.yaml |  2 ++
 src/main.ts         |  6 ++++--
 src/random/png.ts   | 16 ++++++++++++++++
 3 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 pnpm-workspace.yaml
 create mode 100644 src/random/png.ts

diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
new file mode 100644
index 0000000..efc037a
--- /dev/null
+++ b/pnpm-workspace.yaml
@@ -0,0 +1,2 @@
+onlyBuiltDependencies:
+  - esbuild
diff --git a/src/main.ts b/src/main.ts
index 0c1e0b9..92d80f2 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -2,7 +2,7 @@ import './style.css';
 import * as THREE from 'three';
 import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
 import { flyChaos } from './fly';
-
+import { randomPng } from './random/png';
 const gridSize = 10;
 const cardSize = 3;
 const scene = new THREE.Scene();
@@ -25,7 +25,9 @@ const cards: THREE.Mesh[] = [];
 
 const geometry = new THREE.BoxGeometry(cardSize, cardSize, 0.1);
 const textureLoader = new THREE.TextureLoader();
-const pandaTexture = textureLoader.load('./panda.png');
+// const pandaTexture = textureLoader.load('./panda.png');
+// const pandaTexture = textureLoader.load(randomPng(8));
+const pandaTexture = textureLoader.load(randomPng("小熊猫"));
 pandaTexture.colorSpace = THREE.SRGBColorSpace;
 const material = new THREE.MeshStandardMaterial({
   map: pandaTexture,
diff --git a/src/random/png.ts b/src/random/png.ts
new file mode 100644
index 0000000..6c2de9b
--- /dev/null
+++ b/src/random/png.ts
@@ -0,0 +1,16 @@
+// 数字图片，然后base64的图片
+export const randomPng = (content: number | string = 1) =>{ 
+  const canvas = document.createElement('canvas');
+  const ctx = canvas.getContext('2d')!;
+  const size = 128;
+  canvas.width = size;
+  canvas.height = size;
+  ctx.fillStyle = '#'+Math.floor(Math.random()*16777215).toString(16);
+  ctx.fillRect(0, 0, size, size);
+  ctx.font = 'bold 32px Arial';
+  ctx.fillStyle = '#ffffff';
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  ctx.fillText(content.toString(), size / 2, size / 2);
+  return canvas.toDataURL();
+}
\ No newline at end of file