Canvas 会减小 Jpeg 的图像大小,但为什么呢?

2024-02-26

当我使用以下命令将 JPEG 图像绘制到 Canvas 时drawImage()之后,使用canvas.toDataURL()使其可保存在本地(用鼠标右键单击),则保存的 Jpeg-Image 的文件大小会减少约 40%。仅当使用 Jpeg 时才如此。 PNG、GIF(非压缩文件)会增大尺寸。我想,如果我将图像文件转换为 Base64,大小会增加约 130%。所以我认为画布元素有自己的集成压缩功能?如果是这样,我可以停用它吗?

代码如下所示:

var img = new Image();

img.onload = function () 
{
var width = img.width;
var height = img.height;
context.drawImage(img, 0, 0,width,height);
document.images[0].src = canvas.toDataURL('image/jpeg');//<-size = 30,2 KB (30.990 Bytes)
}
img.src = "http://www.roomeffect.de/pageslices/RSB.jpg"; //<-original file size = 58,5 KB (59.930 Bytes)

我不知道问题是什么?


您可以将 JPEG 质量指定为 toDataURL 函数的第二个参数。 Firefox 中的默认质量为 0.92 (92%)。

https://developer.mozilla.org/en/DOM/HTMLCanvasElement https://developer.mozilla.org/en/DOM/HTMLCanvasElement

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

Canvas 会减小 Jpeg 的图像大小,但为什么呢? 的相关文章

  • 如何动态突出显示网页上的字符串?

    我想创建带有 url 的页面 例如 http xyzcorp schedules 2015Aug24 Aug28 Jim Hawkins http xyzcorp schedules 2015Aug24 Aug28 Billy Bones
  • 将文本大小调整为矩形 在 Canvas HTML5 中调整大小

    我是 Canvas 新手 我正在创建一个网站 以在调整矩形大小时增加文本 我尝试了很多 但没有任何效果 实际上 我希望如果我仅按其宽度调整矩形大小 向左拉伸 向右拉伸 则仅应增加文本宽度而不是字体大小 我已经完成了字体大小 但发现增加孤立文
  • 同页锚链接到部分 id 在 IE8 中不起作用

    我有一个带有导航的单页 HTML5 网站 可以将用户引导至该部分 在除 IE8 之外的所有浏览器中都可以正常工作 IE8 不执行任何操作 我所拥有的虚拟版本 a href about About a a href work Work a a
  • 获取点击的的DOM路径

    HTML div class lol a class rightArrow href a div 伪代码 rightArrow click function rightArrowParents this dom dom is the pse
  • Django - 提交具有同一字段多个输入的表单

    预警 我对 Django 以及一般的 Web 开发 非常陌生 我使用 Django 托管一个基于 Web 的 UI 该 UI 将从简短的调查中获取用户输入 通过我用 Python 开发的一些分析来提供输入 然后在 UI 中呈现这些分析的可视
  • 计算文本选择的 xy 位置

    我正在尝试使用 DOM 元素创建自己的文本选择 是的 我的意思是当您在此元素中选择文本时 您会在文本后面看到蓝色背景 这个想法是停止默认行为 蓝色 并使用我自己的元素来完成工作 方法是找到选择的 xy 位置 然后放置绝对定位的元素 我希望能
  • 禁用特定 div 上的 Tab 键

    我有以下结构 div div Some content div div Some content div div 我想 禁用 div2 上的 tab 键 我的意思是按下 tab 键时 div2 的元素不会获得焦点 有没有简单的方法可以使用
  • 如何让div与包含td的高度相匹配?

    我沿着桌子的一排布置了三个 面板 一个比另外两个高 我希望所有三个面板都与最高的一个的高度相匹配 我尝试将 div 的样式设置为 height 100 但是即使包含的 tds 增长 短面板仍然很短 我的 HTML 是由 JSF 生成的 因此
  • 如何在表格列标题处垂直旋转文本

    我用过这个数据表 http www datatables net 在我的网页上 这是fiddle http jsfiddle net fxju7 2 链接我放置代码的地方 我想要 第一个数字第二个数字列应该垂直旋转 我已经做到了 但是 问题
  • 将html表格保存到excel中[关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我必须编写一个程序 定期读取网页并将
  • 我可以从命令行打印 html 文件(带有图像、css)吗?

    我想从脚本中打印带有图像的样式化 html 页面 谁能建议一个开源解决方案 我使用的是 Linux Ubuntu 8 04 但也对其他操作系统的解决方案感兴趣 你可以给html2ps http user it uu se jan html2
  • 我应该使用哪种文档类型?

    如果我想使用可定制的 div 我应该使用哪种文档类型 具有div动画 图像移动 设置div不透明度等 我尝试通过 javascript 创建一个 div 设置其背景颜色 位置 宽度和高度 并向其添加 onmouseover 事件 一切正常
  • 如何在 Bootstrap 3 的导航栏中添加带有图标的搜索框?

    我正在使用新的 Twitter Bootstrap 3 并尝试放置一个像这样的搜索框 如下 在顶部导航栏中 在 Bootstrap 2 中 可以这样完成
  • 为什么我的反应路由器链接将我带到页面中间?

    我的网站上有很多链接 但只有一个可以执行此操作 它没有将我带到导航栏的顶部 而是转到内容的中间 知道为什么会这样吗 这是一个页面 其中有一个 map经历一些JSON 这是渲染div页面下方的文本元素 如果重要的话 这是一些可能相关的代码 路
  • 如何处理 Django 中的错误

    我想让我的 django 应用程序尽可能对用户友好 并且我想处理适当的错误并让它推出类似于 javascript 中的警报的错误消息 我想在没有上传文件时执行此操作 因此 当按下上传按钮并且尚未上传任何内容时 将会发出一条警报消息 我的看法
  • 我怎样才能让这个脚本在 WordPress 上运行?

    我有这个脚本 document ready function text1 click function this hide 代码html div class div1 p class text1 text to appear when th
  • 如何转义 HTML 字符?在.NET中-->“

    如何在 NET 中转义 HTML 字符 我正在从 json 字符串中获取 html 并在标题中得到 amp quot more text 看起来我需要做两次才能得到 amp quot 成为 quot 那么它就是一个 如何转义 NET 中的所
  • 检索 css3 缩放元素的宽度/高度

    我正在与 offsetWidth 属性的奇怪之处 我认为 作斗争 这是场景 比方说 我有一个span标签 在我的js中 在某个时刻我执行css3转换 对于这个元素 例如 el set styles transform scale scale
  • HTML 代码中的 PHP [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我用 HTML 代码编写了 PHP div div 但这出现在输出页面中 else print 我怎样才能让PHP执行 你的文件有一个 p
  • Bootstrap 导航栏与 Google 位置重叠自动完成下拉菜单

    我有一个导航栏 我试图在其中添加一个地点搜索框 除了谷歌位置提示框的一小部分被导航栏重叠 如下图所示 之外 一切几乎都有效 我尝试过改变z index输入框的值改为10或2000或90000但似乎没有效果 我还缺少其他需要做的事情吗 这是

随机推荐

  • pandas 按大写字母排序

    运行这段代码 df pd DataFrame ADc Abc AEc columns Test index 0 1 2 df sort columns Test axis 0 ascending False inplace True 返回排
  • C++开源项目推荐[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • ActionBar 中操作/菜单项的动态控制

    有没有办法动态禁用 隐藏 添加 删除 ActionBar 中的菜单项 例如 在用户在活动中填写有效的电话号码之前 操作将被禁用 我在 ActionBar API 中没有找到任何有用的方法 唯一的方法似乎是在 ActionBar 中使用自定义
  • 如何使用imagick的writeImage()函数?

    如果我将脚本保存在与正在操作的图像相同的目录中 则此方法有效 并且结果图像 foo jpg 也在同一位置生成 但是 如果脚本位于一个位置 而我希望使用的图像位于另一个位置 而我希望保存缩略图的位置位于其他位置 那么如何指定这些路径呢 做这样
  • 使用 Jekyll 插件在 _site 内生成文件

    我编写了一个 Jekyll 插件 Tags 它生成一个文件并返回该文件的链接字符串 一切都很好 但如果我将该文件直接写入 site 文件夹 它就会被删除 如果我将该文件放在 site 文件夹之外 则它不会在 site 内生成 我应该在哪里以
  • 为什么 KineticJS 文档中没有draw()方法?

    我花了几个小时在谷歌上搜索 Kinetic Layer draw 方法 我发现的只是用例 没有关于如何 何时以及为何使用它的文档 也许它已经被弃用了 这些是我在学习和使用这个精彩框架时使用的主要链接 http kineticjs com d
  • 无法使 Laravel 4 的 Validator 类在框架外工作

    我正在尝试在框架之外使用 Laravel 4 Eloquent 因为 Illuminate Database 包已通过 Composer 独立可用 Eloquent 本身运行良好 但我在尝试实现验证规则时遇到了阻碍 我首先尝试使用一些预构建
  • 如何处理 Cordova 或 Phonegap 上 android 4.0-4.3 和 4.4 之间的宽度不一致?

    我正在 Cordova 3 4 上做一个应用程序 并在使用 Android 4 4 2 的 Moto X 使用 Android 2 3 的 Samsung Galaxy Ace 和模拟器上进行测试 我保留 cli 创建的原始视口 在CSS上
  • jQuery UI 对话框如何禁用后台输入的焦点?

    当您使用 jQuery UI 打开模式对话框时 您会注意到 如果使用 Tab 键 则可以将焦点放在对话框的按钮上 但对话框外部的任何输入都会被忽略 我正在尝试实现同样的行为jQuery UI 工具叠加 http jquerytools or
  • 具有绝对位置的嵌套 Touchable

    我需要实现一个界面 其中一个对象是可单击的 但该对象的一个 区域执行另一个操作 如下所示 gt clicking on this small area does an action gt clicking on this area does
  • 值循环的最小排序

    给定如下序列 1 2 1 2 1 1 1 2 1 2 1 3 1 2 1 2 1 3 什么是高效的获得最小订购量的方法 1 1 1 2 1 2 1 3 1 2 1 2 1 3 1 2 1 2 暴力方法是显而易见的 所以请不要推荐它 除非提供
  • 如何通过 Facebook 的 Graph API 获取共同好友

    有没有办法使用 Facebook 的 Graph API 获取共同好友列表 我一直在玩这个工具 https www simoncross com fb graph GET https graph facebook com 并且还没有想出办法
  • 使用 MVVM 绑定 ComboBox SelectedItem

    我有一个问题选定的项目 in my ComboBox
  • 如何找到对用户控件的所有引用

    在 Visual Studio 2010 中 我有一个非常大的 ASP NET 网站项目 其中有很多用户控件 如何确定整个项目中引用特定 ascx 用户控件的所有 aspx 页面 Thanks 右键单击您的班级User Control并选择
  • 如何在设计时制作支持拖放的自定义WPF ContentControl?

    我想创建内部有一个 子 控件的自定义 WPF 控件 子类化ContentControl or UserControl有效 但有一个缺陷 这些控件在设计器模式下不起作用 我所说的 不起作用 是指这种情况 假设我有一个Canvas里面有我的自定
  • 如何在 iPhone 中保存密码?

    我需要创建一个 iPhone 应用程序 它将与网站通信 所以它需要用户名和密码 现在我需要知道如何在 iphone 中保存用户名和密码 我已经使用过 NSuserdefaults 但这并没有解决我的 pblm 另外我需要恢复视图 从用户退出
  • 使用从情节提要中的通用类继承的类时,出现“界面生成器文件中的未知类”

    我最近重构了我的课程BookTableViewController来自简单的继承UITableViewController 这样它现在继承自泛型类FetchedResultsTableViewController
  • 在 Android 模拟器中以“飞行”模式进行测试

    我正在尝试在手机没有连接到互联网的情况下测试我的应用程序 在我的模拟器中 我在设置中打开了飞行模式 但是 我的应用程序似乎仍然能够与我的服务器通信 它正常工作 在我的设备上 相同的代码在没有数据连接的情况下引发错误 如何确保模拟器中没有互联
  • Route.php找不到我创建的控制器类

    我正在尝试构建一个 silex 应用程序 我的文件结构是 ROOT App Controller IndexController php Config dev php prod php route php vendor web index
  • Canvas 会减小 Jpeg 的图像大小,但为什么呢?

    当我使用以下命令将 JPEG 图像绘制到 Canvas 时drawImage 之后 使用canvas toDataURL 使其可保存在本地 用鼠标右键单击 则保存的 Jpeg Image 的文件大小会减少约 40 仅当使用 Jpeg 时才如