将字节数组转换为不使用画布的图像数据

2024-02-03

是否可以在不使用画布的情况下将字节数组转换为图像数据?

我目前使用类似的东西,但是我认为可以在没有画布的情况下完成,还是我错了?

var canvas = document.getElementsByTagName("canvas")[0];
var ctx = canvas.getContext("2d");

var byteArray = [ 
    255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, // red
    0, 255, 0, 255, 0, 255, 0, 255, 0, 255, 0, 255, // green
    0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255 // blue
];

var imageData = ctx.getImageData(0, 0, 10, 3);
for(var i = 0; i < byteArray.length; i+=4){
    imageData.data[i] = byteArray[i];
    imageData.data[i+1] = byteArray[i + 1];
    imageData.data[i+2] = byteArray[i + 2];
    imageData.data[i+3] = byteArray[i + 3];
}

ctx.putImageData(imageData, 0, 0);

http://jsfiddle.net/ARTsinn/swnqS/ http://jsfiddle.net/ARTsinn/swnqS/

Update

我已经尝试将其转换为 base64-uri 但没有成功:

'data:image/png;base64,' + btoa(String.fromCharCode.apply(this, byteArray));

Update 2

将问题与问题分开

画布本身不是,而是事实 oldIE(和其他)不支持它。 ...以及像 excanvas 或 flashcanvas 对于这个用例来说似乎有点过于臃肿......


canvas.getImageData返回一个 ImageData 对象,如下所示:

interface ImageData {
  readonly attribute unsigned long width;
  readonly attribute unsigned long height;
  readonly attribute Uint8ClampedArray data;
};

(参见规格:http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#imagedata http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#imagedata)

我想您可以将适合该界面的数据装箱并尝试一下。

如果您尝试,请告诉我结果如何:)

或者,您可以创建一个内存画布您想要的宽度/高度--document.createElement("canvas"),然后获取其图像数据并插入您自己的数组。我知道这有效。是的......这与您的问题相反,但您没有将画布添加到页面中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将字节数组转换为不使用画布的图像数据 的相关文章

  • 单值或常量值时在 x 轴上绘制的样条图 - highchart

    while using the older version of highchart 2 1 6 if a plot had only one value or a series of same values it would plot a
  • Google 饼图未显示所有数据行

    我正在尝试绘制人口与国家名称的关系图 我发现 Google 可视化库仅渲染前几个 实际上数字似乎是随机的 具体取决于我使用的数据 有时添加 其他 条目 但它没有t 实际上具有其余条目的值 Example 1 With all countri
  • 未捕获的类型错误:this.props.signinUser 不是一个函数(…)

    src actions index js import axios from axios const ROOT URL http localhost 3090 export function signinUser email passwor
  • 如何从表中选择所有偶数 id?

    我想从 MySQL 数据库的表中选择所有甚至帖子 ID 然后显示它们 我还想获取所有带有奇怪 id 的帖子并将它们显示在其他地方 我想使用 PHP 来完成此操作 因为这是我使用的服务器端语言 或者 我是否必须选择所有帖子 然后使用 Java
  • 零作为 IIFE 中的第一个参数[重复]

    这个问题在这里已经有答案了 In babeljs v6 5 1 class Foo 编译为 use strict var classCallCheck2 require babel runtime helpers classCallChec
  • 在 asp.net vb 中通过第一个下拉列表值填充第二个下拉列表

    我在使用 asp net vb 时遇到了一些问题 我想做的是有2个下拉框 第一个下拉菜单将有 1 2 3 例如 第二个下拉菜单将有 A 乙 C 默认情况下 但是 如果选择 1 我希望第二个下拉菜单自动选择 c 我不知道 JavaScript
  • 使用 NodeJS 让 Discord 机器人发送带有消息的图片

    我有几张照片 全部在 imgur 上 带有直接图像链接 格式 https i imgur com XXXXXX jpg https i imgur com XXXXXX jpg 以及用 NodeJS 制作的 Discord 机器人 我发送这
  • 为什么将数据存储为元素的属性存在风险?

    我一直在读同样的东西 直接在 DOM 元素上存储属性值是有风险的 因为可能会发生内存泄漏 但有人可以更详细地解释这些风险吗 按属性 我假设您指的是 DOM 元素上的属性 DOM 元素上的自定义属性安全吗
  • 从未定义解构时避免错误

    可以说我有这个代码 const x y point Babel 会将其变成 var point point x point x y point y 这很好 但是如果点未定义怎么办 现在我得到一个错误 Cannot read property
  • 向对象添加元素

    我需要填充一个 json 文件 现在我有这样的东西 element id 10 quantity 1 我需要添加另一个 元素 我的第一步是使用该 json 将该 json 放入对象类型中cart JSON parse 现在我需要添加新元素
  • 使用 jQuery 仅从字符串末尾修剪空格

    我知道 jQuery trim 函数 但我需要的是一种仅从字符串末尾修剪空格的方法 而不是开头 So str this is a string 会成为 str this is a string 有什么建议么 Thanks 您可以使用正则表达
  • 光滑的轮播缓动示例

    我正在使用 Slick Carousel http kenwheeler github io slick http kenwheeler github io slick 但不知道如何合并不同的幻灯片切换 有人有例子可以分享吗 这是我目前拥有
  • 创建一个 int 类型的随机数组。爪哇

    我需要创建一个随机的 int 数组 并按我自己的类对其进行排序 这是我制作数组的地方 public class MyProgram9 public static void main String args int list new int
  • 使用 C 的另一个结构内的灵活长度结构数组

    你好 我正在尝试使用 C 来实现一个简单的结构 2 个盒子 每个盒子包含不同数量的颗粒 main 中传递的粒子的确切数量 我写了以下代码 typedef struct Particle float x float y float vx fl
  • 专用网络:web3.eth.getAccounts() 始终发送空数组

    我正在运行一个私人以太坊网络 我确实用https aws amazon com blockchain templates 整个设置已经完成 AWS 上的设置看起来正确 现在 我正在尝试创建帐户并检索所有这些帐户 为此 我使用以下方法 Web
  • ReactJS:从没有 onChange 事件的 props 中选择默认值?

    所以 我只是想知道我是否绝对需要在 React 中的选择组件上有一个 onChange 事件处理程序 我有一个道具传递我想要选择的选项的默认值 如果我有的话 它就没有问题
  • 将 NPM 包客户端与 nuxt 结合使用

    我对 nuxt 和 javascript 非常陌生 我正在尝试弄清楚如何在客户端使用我的应用程序的依赖项 我将它们列在我的 nuxt config js 中并使用 npm 安装 我也有一个文件 plugins导入它们的目录 不确定这是否好
  • Postman - 如何计算 JSON 响应中特定对象的出现次数

    我是 JSON 和 Postman 的新手 我相信我正在尝试做一些非常简单的事情 我创建了一个 GET 请求 它将获得如下所示的 JSON 响应 在下面的例子中我想得到count响应中所有 IsArchived 属性 这些属性的数量因响应而
  • 使用文本遮盖视频

    是否可以使用 HTML CSS 文本来屏蔽视频 我已经找到并设置了这种工作方式 但没有一种允许文本后面有透明背景 例如 这支笔要求您进行某种填充 它并不是真正掩盖实际视频 而是创造幻觉 https codepen io dudleystor
  • 有没有办法防止输入 type=“number” 获得多个点值?

    我只想得到十进制值 如 1 5 0 56 等 但它允许多个点 有什么办法可以预防吗 您可以使用pattern属性

随机推荐

  • jQuery 使用两个按钮上下滚动 div

    我有一组简单的两个按钮 当悬停时应该使 div 上下移动以模拟滚动效果 down hover function scroll animate marginTop 50px fast up hover function scroll anim
  • rebase后Git分支出现了分歧,那么为什么要rebase呢?

    最近我收到通知说我的分支出现了分歧 就在那时 我创建了一个功能分支 将其推送到远程 并在几天后再次开始处理它时与 master 进行了 rebase git checkout b feature branch git push origin
  • 如果 url 包含以下内容,则不显示此内容

    我有一个简单的 div 如果访问者加载某个 URL 我不想加载它 它看起来像这样 问题是 它不起作用 当我加载 www url com blog 时 div stuff 仍然显示 我只是缺乏睡眠还是上述方法应该有效 如果 url 包含 bl
  • Openrefine - 根据文本将行转置为列

    我收到了来自图书馆目录的数据转储 它以 txt 格式显示 我已经能够将数据放入电子表格中 但它们都在一列中 我想将行转置为列 这一列中的数据按以下顺序排列 标题 文件类型 作者 日期 但在某些情况下 目录记录按以下顺序出现 标题 文件类型
  • 从android中的fragment管理工具栏的导航和后退按钮

    我所有的片段都是通过控制的ActionBarActivity mainActivity 在 mainActivity 内DrawerLayout已实现 所有子片段均通过抽屉布局的列表项单击推送 我面临的问题是通过抽屉布局推送片段后我想将抽屉
  • 网络自动化工具

    我意识到我需要一个成熟的浏览器自动化工具来测试用户与我们的 JavaScript 小部件库的交互 我使用 qunit 从单元测试开始 然后我不明智地开始合并越来越多的功能测试 这是一个坏主意 尝试用 JavaScript 模拟大量用户操作
  • 在 python 中比较字符串时忽略空格

    我正在使用 difflib python 包 不管我是否设置isjunk论证 计算出的比率是相同的 是不是忽略了空格的差异isjunk is lambda x x In 193 difflib SequenceMatcher isjunk
  • 如何在Marklogic中使用Group By?

    我想在 xquery 中使用 Group By 有人可以告诉我如何在 Marklogic 中使用 Group By 吗 或者 您可以使用调用 XSLTxdmp xslt invoke or xdmp xslt eval MarkLogic
  • Pydev:将标准输出发送到真实(tty)终端

    跟进上一个问题 子进程 PyDev 控制台与 cmd exe https stackoverflow com questions 10236260 subprocess pydev console vs cmd exe 有没有办法改变 Py
  • 将警告转换为错误

    在 Windows 中 VC 有一个不错的选择 We http msdn microsoft com en us library thxezb7y aspx将特定警告转换为错误 此外 VC 发出的每个警告都有一个警告编号 例如 warnin
  • 如何将 Reader monad 添加到 Scotty 的 monad 中?

    我正在尝试使用 Scotty 构建一个非常简单的 API 我想扩展 Scotty monad 以便我的路由处理程序操作能够访问不变的环境 我相信做到这一点的方法是添加一个Readermonad 到堆栈 现在我只想传递一些Text周围的数据
  • 如何在 php 中添加形状文件 (.shp) 并在 php 文件中使用该形状文件数据?

    我必须在 php 中开发一个项目 并且必须包含形状文件 并且该形状文件需要转换为 kml 文件 我知道如何将形状文件转换为 kml 文件 但我不知道如何将形状文件导入 导入到 php 项目中 我还有包含更多信息的形状文件的支持文件 其中一些
  • 使用python访问google

    我怎样才能访问谷歌 我试过那个代码 urllib urlopen http www google com 但它显示消息prove you are human或者有些人的想法是这样的 有人说尝试用户代理 我不知道 您应该使用谷歌应用程序编程接
  • 在本地计算机上编译 Azure Functions(.csx 文件)

    我正在使用 AzureQueue 触发器模板 最好在本地计算机中编写函数 编译并执行它 然后部署 而不是在 azure 门户中编写它 有什么办法可以做到吗 Thanks Krishh 答案是肯定的 但目前体验并不好 随着我们增强服务 本地开
  • Alamofire HTTPS 10.3 中的更改

    我目前正在一个项目中使用 Alamofire 并且看到了有关具有不同功能的 10 3 beta 的问题 我有一个在 iOS 10 2 模拟器中运行良好的相同项目 我使用自签名证书向 HTTPS url 发出 get 请求 当我在安装了相同证
  • 如何打印 groupby 对象

    我想打印与 Pandas 分组的结果 我有一个数据框 import pandas as pd df pd DataFrame A one one two three three one B range 6 print df A B 0 on
  • CUDA 不支持边界检查

    我尝试使用 Numba 并访问 GPU 以加速代码 但出现以下错误 in jit raise NotImplementedError bounds checking is not supported for CUDA NotImplemen
  • 测试抛出 IntegrityError 的 SQLAlchemy 代码的正确方法是什么?

    我读过了this https stackoverflow com questions 129507 how do you test that a python function throws an exception问答 并且已经尝试捕获我
  • 在 tfs 中看不到上线选项

    我在离线模式下打开了一个解决方案 但现在我尝试上网并连接到 tfs 但我似乎看不到 文件 gt 源代码管理 下的 上网 按钮 我使用 团队 gt 连接到 Team Foundation Server 选项连接到 TFS 但在 文件 gt 源
  • 将字节数组转换为不使用画布的图像数据

    是否可以在不使用画布的情况下将字节数组转换为图像数据 我目前使用类似的东西 但是我认为可以在没有画布的情况下完成 还是我错了 var canvas document getElementsByTagName canvas 0 var ctx