Skip to content

S
Static

beichen1001 / Static
与 Fork 源项目一致

Fork自 inscode / HTML-CSS-JS

通知 1
Star 0
Fork 0
S
Static

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 4ea45bf6 编写于 作者: W weixin_68179602
浏览文件
操作

Mon Aug 21 18:02:00 CST 2023 inscode

上级 50ebe92a
隐藏空白更改
内联 并排
Showing with 138 addition and 97 deletion
binIndex.html 0 → 100644
浏览文件 @ 4ea45bf6
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>PyScript Test</title>
<link rel="stylesheet" href="/static/pyscript/v2023.05.1/pyscript.css" />
<script defer src="/static/pyscript/v2023.05.1/pyscript.js"></script>
</head>
<body>
<py-config src="./py-config.toml"></py-config>
<py-repl id="py-repl" output="replOutput"></py-repl>
<div id="replOutput"></div>
<input type="file" multiple="true" id="uploadFile" accept="image/png">
<script>
document.getElementById('uploadFile').addEventListener('change', async function (event) {
const fileDict = {};
const files = event.target.files;
for (let i = 0; i < files.length; i++) {
const file = files[i];
const fileName = file.name;
const arrayBuffer = await file.arrayBuffer();
const uint8Array = new Uint8Array(arrayBuffer);
const fileBinaryString = Array.from(uint8Array).reduce((binaryString, value) => binaryString + String.fromCharCode(value), '');
fileDict[fileName] = fileBinaryString;
}
pyscript.interpreter.interface.runPython(`
def saveBinaryStringAsFiles(fileDict):
for key, value in fileDict.to_py().items():
with open(key, 'wb') as f:
f.write(bytes(ord(char) for char in value))
`)
pyscript.interpreter.globals.get("saveBinaryStringAsFiles")(fileDict);
});
/*
function runPython() {
pyscript.interpreter.globals.get("run")(fileDict);
}
*/
</script>
<button onclick="runPython()">RUN</button>
<!--<py-script src="./binMain.py"></py-script>-->
<py-terminal style="overflow: auto; max-height: 100px;"></py-terminal>
<div id="mpl"></div>
</body>
</html>
\ No newline at end of file
binMain.py
浏览文件 @ 4ea45bf6
......@@ -4,99 +4,39 @@ import numpy as np
from PIL import Image
import base64
import io
import os
def extract_image(image_data, count):
# 从数据 URL 中提取编码后的图片内容部分
# image_data = image_data.split(',')[1]
def run(fileDict):
#fileDict = fileDict.to_py()
#def binary_string_to_bytes(binary_string):
# return bytes(ord(char) for char in binary_string)
# 将图片内容部分进行 Base64 解码
# decoded_image_data = base64.b64decode(image_data)
for key, value in fileDict.to_py().items():
with open(key, 'wb') as f:
f.write(bytes(ord(char) for char in value))
img = Image.open(key)
display(img,target="mpl")
# 创建内存中的二进制数据流对象
image_stream = io.BytesIO(image_data)
# 使用 PIL 打开二进制数据流对象，得到 PIL 图像对象
img = Image.open(image_stream)
# 获取图片的宽度和高度
width, height = img.size
w_h_radio = width / height
row_count = math.floor(count / w_h_radio)
current_dir = os.getcwd()
column_count = (count-1) * 3 + 1
row_count = (row_count-1) * 3 + 1
cell_width = width // column_count
cell_height = height // row_count
# 存储挖取后的小图片
extracted_images = []
# 获取当前工作目录下的文件列表
file_list = os.listdir(current_dir)
row_num = 0
col_num = 0
for row in range(row_count):
if row % 3 == 0:
row_images = []
for column in range(column_count):
if column % 3 == 0:
# 计算挖取的区域
left = column * cell_width
upper = row * cell_height
right = left + cell_width
lower = upper + cell_height
# 打印文件列表
for file_name in file_list:
print(file_name)
# 挖取图片并存储
extracted_image = np.array(img.crop((left, upper, right, lower)))
row_images.append(extracted_image)
col_num += 1
row_num += 1
# 将一行的小图片存储到二维数组中
extracted_images.append(row_images)
# 创建新的图片对象，用于重新组成图片
new_img = Image.new('RGB', (len(extracted_images[0]) * cell_width, len(extracted_images) * cell_height))
# 按照二维数组的顺序重新组成图片
for i, row_images in enumerate(extracted_images):
for j, extracted_image in enumerate(row_images):
row = i
column = j
# 计算放置的位置
left = column * cell_width
upper = row * cell_height
# 将小图片放置到新图片中
new_img.paste(Image.fromarray(extracted_image), (left, upper))
return new_img
def run(image_data):
# print(image_data)
count = 30
def binary_string_to_bytes(binary_string):
bytes = bytearray()
for char in binary_string:
bytes.append(ord(char))
return bytes
image_stream = io.BytesIO(binary_string_to_bytes(image_data))
img = Image.open(image_stream)
display(img,target="mpl")
# new_image = extract_image(image_data, count)
#with open(image_data,"r") as f:
# new_image = f.read()
#
# display(new_image,target="mpl")
fileInput = js.document.getElementById('uploadFile')
file = fileInput.files
for i in file:
print(i.name)
print(file.arrayBuffer())
def saveBinaryStringAsFiles(fileDict):
for key, value in fileDict.to_py().items():
with open(key, 'wb') as f:
f.write(bytes(ord(char) for char in value))
img = Image.open(key)
display(img,target="mpl")
\ No newline at end of file
index.html
浏览文件 @ 4ea45bf6
......@@ -12,7 +12,7 @@
<py-config src="./py-config.toml"></py-config>
<py-repl id="py-repl" output="replOutput"></py-repl>
<div id="replOutput"></div>
<input type="file" id="uploadFile" accept="image/png">
<input type="file" multiple="true" id="uploadFile" accept="image/png">
<script>
let imgName;
let imgData;
......@@ -33,8 +33,7 @@
reader.onload = () => {
const arrayBuffer = reader.result;
const uint8Array = new Uint8Array(arrayBuffer);
imgData = uint8Array;
imgData = uint8ArrayToBinaryString(imgData);
//imgData = Array.from(uint8Array).reduce((binaryString, value) => binaryString + String.fromCharCode(value), '');
};
reader.readAsArrayBuffer(file);
......@@ -45,24 +44,16 @@
//formData.append('file', file);
//console.log(formData.get("file"));
//imgData = formData;
file.arrayBuffer().then(function(arrayBuffer) {
file.arrayBuffer().then(function (arrayBuffer) {
console.log(arrayBuffer)
const uint8Array = new Uint8Array(arrayBuffer);
imgData = Array.from(uint8Array).reduce((binaryString, value) => binaryString + String.fromCharCode(value), '');
});
});
function runPython() {
pyscript.interpreter.globals.get("run")(imgData);
}
function uint8ArrayToBinaryString(uint8Array) {
let binaryString = '';
for (let i = 0; i < uint8Array.length; i++) {
binaryString += String.fromCharCode(uint8Array[i]);
}
return binaryString;
}
</script>
<button onclick="runPython()">RUN</button>
<!--<py-script src="./main.py"></py-script>-->
......
main.py
浏览文件 @ 4ea45bf6
......@@ -81,3 +81,61 @@ def run(image_data):
new_image = extract_image(image_data, count)
display(new_image,target="mpl")
"""
<py-config src="./py-config.toml"></py-config>
<py-repl id="py-repl" output="replOutput"></py-repl>
<div id="replOutput"></div>
<input type="file" multiple="true" id="uploadFile" accept="image/png">
<script>
let imgName;
let imgData;
document.getElementById('uploadFile').addEventListener('change', function (event) {
const file = event.target.files[0];
imgName = file.name;
console.log(imgName);
const reader = new FileReader();
/*
reader.readAsDataURL(file);
reader.onloadend = function (e) {
imgData = e.target.result;
};
*/
reader.onload = () => {
const arrayBuffer = reader.result;
const uint8Array = new Uint8Array(arrayBuffer);
//imgData = Array.from(uint8Array).reduce((binaryString, value) => binaryString + String.fromCharCode(value), '');
};
reader.readAsArrayBuffer(file);
console.log(file)
//const formData = new FormData();
// 将文件添加到 FormData 中
//formData.append('file', file);
//console.log(formData.get("file"));
//imgData = formData;
file.arrayBuffer().then(function (arrayBuffer) {
console.log(arrayBuffer)
const uint8Array = new Uint8Array(arrayBuffer);
imgData = Array.from(uint8Array).reduce((binaryString, value) => binaryString + String.fromCharCode(value), '');
});
});
function runPython() {
pyscript.interpreter.globals.get("run")(imgData);
}
</script>
<button onclick="runPython()">RUN</button>
<!--<py-script src="./main.py"></py-script>-->
<py-script src="./binMain.py"></py-script>
<py-terminal style="overflow: auto; max-height: 100px;"></py-terminal>
<div id="mpl"></div>
"""
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或