trafficlunar/blockmatic
1
0
Fork 0
mirror of https://github.com/trafficlunar/blockmatic.git synced 2026-06-28 14:44:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: add alpha channel

Browse source 
will probably make this toggleable due to differences in images
This commit is contained in:
trafficlunar 2024-12-06 15:49:55 +00:00
parent b30ba187e9
commit 5ba53ac805
3 changed files with 277 additions and 277 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/blocks.tsx
View file

@ -6,12 +6,12 @@ import { Sprite } from "@pixi/react";
function Blocks({ blocks, setBlocks }: { blocks: Block[]; setBlocks: React.Dispatch<React.SetStateAction<Block[]>> }) {
const [images, setImages] = useState<{ [key: string]: HTMLImageElement }>({});
const findClosestBlock = (r: number, g: number, b: number) => {
const findClosestBlock = (r: number, g: number, b: number, a: number) => {
let closestBlock = "";
let closestDistance = Infinity;
Object.entries(blocksData).forEach(([block, rgb]) => {
const distance = Math.sqrt(Math.pow(r - rgb[0], 2) + Math.pow(g - rgb[1], 2) + Math.pow(b - rgb[2], 2));
Object.entries(blocksData).forEach(([block, rgba]) => {
const distance = Math.sqrt(Math.pow(r - rgba[0], 2) + Math.pow(g - rgba[1], 2) + Math.pow(b - rgba[2], 2) + Math.pow(a - rgba[3], 3));
if (distance < closestDistance) {
closestDistance = distance;
closestBlock = block;
@ -49,7 +49,7 @@ function Blocks({ blocks, setBlocks }: { blocks: Block[]; setBlocks: React.Dispa
const newBlocks: Block[] = [];
for (let i = 0; i < imageData.data.length; i += 4) {
const block = findClosestBlock(imageData.data[i], imageData.data[i + 1], imageData.data[i + 2]);
const block = findClosestBlock(imageData.data[i], imageData.data[i + 1], imageData.data[i + 2], imageData.data[i + 3]);
const x = Math.floor((i / 4) % imageData.width);
const y = Math.floor(i / 4 / imageData.width);