+
趣味功能
-
马赛克化
+
群体模糊(x0.3)
动画模式
（很慢！）
下载
diff --git a/main.js b/main.js
index 09797ad..277f7d0 100644
--- a/main.js
+++ b/main.js
@@ -1,4 +1,4 @@
-let dropBox, canvasList, imgList, work, imgCols
+let dropBox, canvasList, imgList, work, imgCols, scale_mode, datas
let canvass = [], imgs = []
let pic_info
let multi
@@ -80,6 +80,7 @@ function processFiles(files) {
document.getElementById("pic_scale_size").style.display = "flex";
document.getElementById("pic_scale_sc").style.display = "flex";
document.getElementById("pic_scale_fun").style.display = "flex";
+ document.getElementById("pic_scale_mode").style.display = "flex";
work.style.display = "flex";
if (multi == 1) {
let pic_num = document.createElement('div');
@@ -225,23 +226,71 @@ function scale_size_sc() {
function scale_size_ma() {
for (let i = 0; i < canvass.length; i++) {
- // let minx = Math.min(canvass[i].width, canvass[i].height)
- // let ls = 0;
- // while (minx) {
- // ls++
- // minx = Math.floor(minx / 10);
- // }
- // if (ls > 2) {
- // let scale_s = Math.pow(10, ls-2);
- // scale(i, 1 / scale_s, 1 / scale_s)
- // scale(i, scale_s, scale_s)
- // }
-
scale(i, 0.3, 0.3)
}
}
+// 双线性插值辅助计算函数
+function linear_single(x, x1, x2, f1, f2) {
+ return Math.floor(f1 * (x2 - x) / (x2 - x1) + f2 * (x - x1) / (x2 - x1))
+}
+
+function linear_insert(row, col, scale_x, scale_y, datas) {
+ x = row / scale_y
+ y = col / scale_x
+ x1 = Math.floor(x)
+ x2 = Math.ceil(x)
+ y1 = Math.floor(y)
+ y2 = Math.ceil(y)
+ if (x2 >= ori_h) {
+ x2 = x1
+ }
+ if (y2 >= ori_w) {
+ y2 = y1
+ }
+
+ if (x1 == x2 && y1 == y2) {
+ return { 'r': datas[x1][y1][0], 'g': datas[x1][y1][1], 'b': datas[x1][y1][2], 'a': datas[x1][y1][3] }
+ }
+ if (x1 == x2) {
+ x = x1
+ r = linear_single(y, y1, y2, datas[x][y1][0], datas[x][y2][0])
+ g = linear_single(y, y1, y2, datas[x][y1][1], datas[x][y2][1])
+ b = linear_single(y, y1, y2, datas[x][y1][2], datas[x][y2][2])
+ a = linear_single(y, y1, y2, datas[x][y1][3], datas[x][y2][3])
+ return { 'r': r, 'g': g, 'b': b, 'a': a }
+ }
+
+ if (y1 == y2) {
+ y = y1
+ r = linear_single(x, x1, x2, datas[x1][y][0], datas[x2][y][0])
+ g = linear_single(x, x1, x2, datas[x1][y][1], datas[x2][y][1])
+ b = linear_single(x, x1, x2, datas[x1][y][2], datas[x2][y][2])
+ a = linear_single(x, x1, x2, datas[x1][y][3], datas[x2][y][3])
+ return { 'r': r, 'g': g, 'b': b, 'a': a }
+ }
+ fy1_r = linear_single(x, x1, x2, datas[x1][y1][0], datas[x2][y1][0])
+ fy1_g = linear_single(x, x1, x2, datas[x1][y1][1], datas[x2][y1][1])
+ fy1_b = linear_single(x, x1, x2, datas[x1][y1][2], datas[x2][y1][2])
+ fy1_a = linear_single(x, x1, x2, datas[x1][y1][3], datas[x2][y1][3])
+ fy2_r = linear_single(x, x1, x2, datas[x1][y2][0], datas[x2][y2][0])
+ fy2_g = linear_single(x, x1, x2, datas[x1][y2][1], datas[x2][y2][1])
+ fy2_b = linear_single(x, x1, x2, datas[x1][y2][2], datas[x2][y2][2])
+ fy2_a = linear_single(x, x1, x2, datas[x1][y2][3], datas[x2][y2][3])
+ r = linear_single(y, y1, y2, fy1_r, fy2_r)
+ g = linear_single(y, y1, y2, fy1_g, fy2_g)
+ b = linear_single(y, y1, y2, fy1_b, fy2_b)
+ a = linear_single(y, y1, y2, fy1_a, fy2_a)
+ return { 'r': r, 'g': g, 'b': b, 'a': a }
+}
+
async function scale(index, scale_x, scale_y) {
+ if (document.getElementById("linear").checked) {
+ scale_mode = 0;
+ }
+ else {
+ scale_mode = 1;
+ }
canvas = canvass[index]
cxt = canvas.getContext("2d")
imgData = cxt.getImageData(0, 0, canvas.width, canvas.height);
@@ -276,10 +325,19 @@ async function scale(index, scale_x, scale_y) {
for (let i = 0; i < ori_h * scale_y; i++) {
for (let j = 0; j < ori_w * scale_x; j++) {
- red = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][0];
- green = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][1];
- blue = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][2];
- alpha = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][3];
+ if (scale_mode == 0) {
+ re = linear_insert(i, j, scale_x, scale_y, datas)
+ red = re['r']
+ green = re['g']
+ blue = re['b']
+ alpha = re['a']
+ }
+ else if (scale_mode == 1) {
+ red = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][0];
+ green = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][1];
+ blue = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][2];
+ alpha = datas[Math.floor(i / scale_y)][Math.floor(j / scale_x)][3];
+ }
ctx.fillStyle = "rgba(" + red + "," + green + "," + blue + "," + alpha + ")";
ctx.fillRect(j, i, 1, 1)
if (ani_mode) if (j % 100 == 0) await sleep(1);
@@ -327,14 +385,12 @@ function saveImg() {
let blobs = []
for (let i = 0; i < canvass.length; i++) {
canvass[i].toBlob(function (blob) {
- console.log(blob)
saveAs(blob, "yiipic_" + (i + 1) + ".png");
});
}
}
else {
canvass[0].toBlob(function (blob) {
- console.log(blob)
saveAs(blob, "yiipic.png");
});
}