如何将原始十六进制图像转换为html img [英] How to convert a raw hexadecimal image to a html img

问题描述

我有一个原始的十六进制表示形式，像这样：FF00FF00FF00

每2个字母代表一个像素的颜色，在这个例子中是6像素白色 - 黑色 - 白色 - 黑色 - 白色 - 黑色，2×3像素（宽度×高度）。

我想将它转换为html重新呈现的图片。

我想知道最好的解决方案是什么？

我正在考虑将HEX字符串逐个转换为base64，然后使用< img> 标签将其显示在HTML页面上。

我使用python转换它：

  encoded = HEX_STRING .decode（hex）。encode（base64）
  

我这 / wAA / wAA / wAA 。然后，我会将它作为 src 添加到图片标记中：< img src ='data：image / png; base64，iVBORw0KGgo / wAA / wAA / wAA'alt ='img'>

这是行不通的。

我能想到的唯一方法是用html画布逐个像素地绘制图像。

我想知道是否有更简单的解决方案？

解决方案

一个基本的方法：

  import ast 
导入imageio 
导入numpy为np 
 data =FF00FF00FF00* 100 
 shape =（30,20）
 
 to_int = ast.literal_eval（str（0x）+ data）
 to_array = np .frombuffer（to_int.to_bytes（len（data）// 2，'big'），
 np.uint8）.reshape（shape）
 ## 
 imageio.imsave（try。 png，to_array）
  

图像在那里：

I have a raw hexadecimal representation of and image like this: "FF00FF00FF00"

Every 2 letters represent the color of one pixel, in this example it is 6 pixels white -black -white - black -white - black, 2x3 pixels (width x height).

I want to convert this into an html re-presentable image.

I was wondering what the best solution for this would be?

I was thinking of converting the HEX string one by one into base64 and then use a <img> tag to display it on an html page.

I was using python to convert it:

encoded = HEX_STRING.decode("hex").encode("base64") 

Converting it pixel by pixel would give me this /wAA/wAA/wAA. Then I would add this as a src to an image tag: <img src='data:image/png;base64,iVBORw0KGgo/wAA/wAA/wAA' alt='img'>

This doesn't work.

The only other way I could think of is drawing an image pixel by pixel with html canvas.

I'm wondering if there is an easier solution?

解决方案

A basic way to do that:

import ast
import imageio
import numpy as np
data="FF00FF00FF00"*100
shape=(30,20)

to_int=ast.literal_eval(str("0x")+data)
to_array=np.frombuffer(to_int.to_bytes(len(data)//2,'big'),
np.uint8).reshape(shape)
##
imageio.imsave("try.png",to_array)

The image is there :

这篇关于如何将原始十六进制图像转换为html img的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！