使用 HTML5 Canvas 显示浮点数的矩阵/图像
我正在寻找一种使用 HTML5 canvas 元素来显示浮动图像的方法。考虑一个灰度图像,其中值不是 8 位整数也不是 16 位整数,而是浮点数(或双精度数)。我想要一个 javascript/html5 解决方案来使用颜色图在浏览器中显示图像。此外,我希望用户能够交互式地调整最小值和最大值。
这种操作在 ImageJ 等科学成像软件中很常见,但我还没有找到 javascript/html5 解决方案。 Pixastic 似乎处于正确的轨道上,但更面向彩色图像处理。
任何想法,提前致谢
I am looking for a way to use HTML5 canvas element to display an image of floats. Consider a grey scale image where values are not 8-bit nor 16-bit integers but are floats (or doubles). I would like to have a javascript/html5 solution to display the image inside the browser using a colormap. Additionally, I would like the user to be able to adjust interactively the minimum and maximum value.
This operation is quite common in scientific imaging software such as ImageJ but I haven't found a javascript/html5 solution. Pixastic seems to be in the right track for this but is more oriented to color image processing.
Any ideas, thanks in advance
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我想我对工作也有同样的需求。
首先,我想说我不提供库解决方案,但我告诉你我是如何编码的。
我选择使用画布线性渐变来制作颜色图画布。
为了在我的图片上应用这个渐变,我只需计算我需要表示的最小/最大值,然后考虑我的线性渐变搜索颜色对应的每个值。
我的图片已使用drawImage 包含在画布中。
然后我使用数据数组上的 canvasPixel 操作更改了每个像素的颜色。
对于交互式移动颜色图,我选择使用 JqueryUi 滑块。
所有这些都链接在我的代码上,而且做起来有点长。
好吧,我添加了一些更复杂的东西,因为用户可以使用 colorPicker Jquery 插件修改 LinearGradient 的颜色,但这或多或少也是您想要的?
我希望我能回答你的问题。祝你好运。
I think I had the same need for work.
First i would say that I don't offer a library solution but I tell you how I code this.
I choose to make the colormap canvas using canvas linear Gradient.
To apply this gradient on my picture, I simply calcul the min/max of value I need to represent, then I searched for each values what colors correspond considering my linear gradient.
My picture has been included in a canvas using drawImage.
Then I changed the color of each pixel using canvasPixel manipulation on data array.
For interactive move colormap I choose to use JqueryUi slider.
All of this is linked on my code and it was a bit long to do.
Well I added some more complicated stuff because user is able to modify the color of linearGradient using a colorPicker Jquery plugin but it's more or less what you want too ?
I hope I answer your question. Good luck.