基于EXIF在Chrome中将照片从文件绘制到画布的旋转
基础概念
EXIF（Exchangeable Image File Format）是一种存储在图像文件中的元数据格式，包含了关于图像的拍摄设备、设置和时间等信息。其中，EXIF信息中包含了一个方向标签（Orientation Tag），用于指示图像的正确方向。这个标签的值从1到8，分别表示不同的旋转和翻转状态。
相关优势
- 自动校正方向：通过读取EXIF信息中的方向标签，可以在显示或处理图像时自动校正其方向，确保图像以正确的方向展示。
- 跨平台兼容性：EXIF标准被广泛支持，可以在不同的操作系统和浏览器中实现一致的图像方向处理。
类型
EXIF方向标签有以下几种类型：
- 1 (正常)：图像正常，无旋转或翻转。
- 3 (180度旋转)：图像旋转180度。
- 6 (顺时针90度旋转)：图像顺时针旋转90度。
- 8 (逆时针90度旋转)：图像逆时针旋转90度。
- 2 (水平翻转)：图像水平翻转。
- 4 (水平翻转后180度旋转)：图像水平翻转后再旋转180度。
- 5 (水平翻转后逆时针90度旋转)：图像水平翻转后再逆时针旋转90度。
- 7 (水平翻转后顺时针90度旋转)：图像水平翻转后再顺时针旋转90度。
应用场景
在Web开发中，特别是在使用HTML5 Canvas进行图像处理时，读取和应用EXIF方向标签是非常有用的。例如，用户上传的照片可能因为设备的不同而方向不一致，通过读取EXIF信息并应用正确的旋转，可以确保图像在网页上正确显示。
问题与解决方法
在Chrome浏览器中，将照片从文件绘制到Canvas时，可能会遇到图像方向不正确的问题。这是因为浏览器默认不会自动应用EXIF方向标签。以下是一个解决方案：
示例代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>EXIF Orientation in Canvas</title>
</head>
<body>
<input type="file" id="imageUpload" accept="image/*">
<canvas id="canvas"></canvas>
<script>
document.getElementById('imageUpload').addEventListener('change', function(event) {
const file = event.target.files[0];
if (!file) return;
const img = new Image();
img.src = URL.createObjectURL(file);
img.onload = function() {
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
EXIF.getData(img, function() {
const orientation = EXIF.getTag(this, 'Orientation');
let width = img.width;
let height = img.height;
switch (orientation) {
case 3:
ctx.rotate(Math.PI);
break;
case 6:
ctx.rotate(Math.PI / 2);
width = img.height;
height = img.width;
break;
case 8:
ctx.rotate(-Math.PI / 2);
width = img.height;
height = img.width;
break;
}
canvas.width = width;
canvas.height = height;
ctx.drawImage(img, 0, 0, width, height);
});
};
});
</script>
</body>
</html>解释
- 读取EXIF数据：使用
EXIF.getData方法读取图像的EXIF数据。 - 获取方向标签：使用
EXIF.getTag方法获取方向标签的值。 - 根据方向标签旋转图像：根据方向标签的值，使用
ctx.rotate方法旋转Canvas的上下文，并调整Canvas的宽度和高度。 - 绘制图像：使用
ctx.drawImage方法将图像绘制到Canvas上。
参考链接
- EXIF.js：一个用于读取图像EXIF数据的JavaScript库。
- MDN Web Docs - CanvasRenderingContext2D
通过上述方法，可以确保在Chrome浏览器中将照片从文件绘制到Canvas时，图像的方向是正确的。
相关·内容
2回答
我正在构建一个显示图片的web应用程序。大多数照片都是用智能手机拍摄的，并且有EXIF旋转信息。我暴露了一个url，它返回未修改的图像blob。
我已经注意到，当我把这个url放在img标签中时，Chrome并不支持EXIF方向数据，但当我把这个url放在chrome地址栏中时，它会显示一个带有图像的页面，然后它就会尊重EXIF方向。
很抱歉我不能分享这张图片，我会尝试找到另一个我可以分享的例子。
有没有人注意到这个问题？
浏览 1提问于2017-02-23得票数 27
回答已采纳
1回答
我找不到使用FileReader.readAsDataURL的任何示例，并在一个容器中显示结果图像，该容器具有正确的图像方向。
所有来自我的相机和iPhone设备的肖像图像都有这个问题。只有土坯照片保存的肖像照片似乎没有这个问题。
这是我在互联网上找到的一个例子系统。我的代码非常相似：
请注意，当上传这张照片时，它是以景观模式加载的：
请注意，当使用浏览器下载图像时，图像实际上显示在风景中。当您将它保存到磁盘并与查找器一起打开时，它将在纵向中预览。(可能查找器使用exif信息很聪明)
使用exif.js，我发现示例图像有一个Orientation=8，使用photoshop保存的照片有一个Or
浏览 2提问于2012-03-05得票数 4
Chrome会根据exif数据自动旋转从文件输入绘制到画布的任何图像。这很棒，但是iOS不会做同样的事情。有没有一种方法可以防止这种行为，这样我就可以自己变换图像了。通过我写的一个修复程序，它可以在iOS中工作，禁用这个修复程序在安卓系统上也可以工作。宁可禁用/启用，也不想玩浏览器识别游戏。 我已经尝试将图像的样式设置为image-orientation: none；....但这并没有起到任何作用。还是旋转了一下。 编辑:我通过查看样式对象上的'imageOrientation‘是否未定义，或者是新创建的img标签上的空字符串来检测到这一点。也许不是一个完美的测试，但它适用于我测试过
浏览 48提问于2020-04-21得票数 7
回答已采纳
我从HTML文件输入中读取一个文件。对于iOS，我可以用相机拍一张照片。问题是，如果您用相机拍照，内容将包括EXIF数据(至少如果我使用FileReader API读取文件内容)。
如果图像包含EXIF数据，我不能使用画布裁剪。因为每当我打电话给.toDataURL()时，图像就会被破坏。我猜它不识别EXIF数据，也不知道如何使用EXIF数据裁剪图像。
文件内容正在由base64由FileReader.readAsDataURL()编码。我把它插入到img.src中。
裁剪是在旧图像的基础上用ctx.drawImage(...)绘制新的图像，最后用c.toDataURL()获取新的图像数据。
浏览 3提问于2013-11-05得票数 11
4回答
我们使用FileReader从iPhone上拍摄的照片中获取图像，并将其放入浏览器。然后，我们使用drawImage()在canvas上绘制该图像。问题是，在iPhone显示屏上拍摄的照片会在页面上旋转。我们不能在任何Android设备上重现这一点。
我们可以很容易地旋转canvas上的图像，但是如何确定所需的旋转呢？我们尝试了一些用于JavaScript ()的EXIF读取库，但无法成功读取方向。
浏览 2提问于2013-04-26得票数 11
回答已采纳
在我正在使用的移动web浏览器中使用input[type='file']捕获照片后，我正在尝试在画布中以正确的方向绘制照片：
fileReader.onloadend = function() {
var exif = EXIF.readFromBinaryFile(new BinaryFile(this.result));
switch(exif.Orientation){
case 8:
ctx.rotate(90*Math.PI/180);
break;
case 3:
浏览 4提问于2014-06-03得票数 3
1)我有两个表:照片表和EXIF表。EXIF表存储照片的exif数据。
照片表有: EXIF表有：exif_id, photo_id.
因此，在本质上，照片表格中的exif_id可以是EXIF表格中的FK到exif_id。但exif表中的photo_id可以是照片表中的FK到photo_id。我需要两个FK吗?还是一个FK就可以？
2)我见过的所有示例模式都有一个用于存储明胶照片的照片表。头像相册和现场头像怎么样？这通常是一个单独的表，还是仅仅是相册表中的一个标志？
浏览 0提问于2011-02-09得票数 1
回答已采纳
1回答
我对with和图像旋转的图像有问题。
更具体而言：
图像#1 被Image的imagecreatefromjpeg正确旋转(exif标记被授予)，而不是在Picasa或Win10照片查看器中。
在我的代码中没有旋转，当我说“由when的图像正确地旋转”时，我是认真的，文学。简单地做
$img = imagecreatefromjpeg($filename);
图像从文件中加载并正确旋转。我正在运行PHP5.5.31-2+deb.sury.org~trusty+1和GDVersion2.1.1-dev。
图像#2 不是由Image的imagecreatefromjpeg正确旋转的(exif标记没
浏览 4提问于2016-01-25得票数 2
回答已采纳
我正在从给我提供base64数据的iOS相机中拍照。我试图在画布中渲染它，但画布渲染的图像是旋转的。
但是如果我在img标签中渲染相同的图像，它的方向是正确的。
这在android canvas中工作得很好。问题仅发生在iOS画布上。无论是拍照还是从库中选择，都会发生此问题。
下面是拍摄照片的代码
const options: CameraOptions = {
quality: 50,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.PNG,
浏览 2提问于2018-03-22得票数 0
2回答
我正在创建一个web应用程序，它允许在画布中直接上传图像。有时，当从iPad或其他类似设备上传图像时，它们的定位是不同的。
我试图找到一种方法，以提取他们的方向信息，并相应地旋转的图像在画布。
我尝试过的事物：
我试过提取EXIF信息：
dataUrl = canvas.toDataURL('image/jpeg')；var bin = atob(dataUrl.split('，')1)；var exif =EXIF.readFromBinaryFile(新BinaryFile(bin))；BinaryFile(exif.Orientation)；
浏览 1提问于2013-09-05得票数 5
回答已采纳
2回答
我正在开发一个上传图像到亚马逊S3的iPhone相机应用程序，该图像显示在网站上。当iPhone拍摄照片时，它总是以垂直方向保存照片，而用于正确查看照片的方向保存在图像的EXIF数据中。因此，如果我用iPhone拍摄照片并在FireFox中打开它，而不处理EXIF数据，图像可能是侧面的或颠倒的。
我的问题是我不知道如何在网站上以正确的方向显示照片。我目前的解决方案是在iPhone应用程序中旋转照片，但我不想这么做。在没有对图像进行预处理的情况下，在web上显示EXIF数据时，是否需要尊重EXIF数据？
浏览 1提问于2010-03-17得票数 3
回答已采纳
1回答
当照片在HTML5画布元素上显示并旋转时，结果在FireFox中看起来很好，但在Chrome中却很糟糕。似乎Google Chrome不知道如何平滑旋转的边缘。
举个例子，看看，把其中一张照片放大，然后围绕它的中心稍微旋转一下。打开“简单模式”，这样照片就会有白色的边框，以获得最大的对比度。现在你会看到照片的边缘一点也不平滑。在FireFox中，结果要好得多！
有人知道这个问题是否可以解决吗？
浏览 6提问于2012-04-10得票数 2
回答已采纳
我用PHP开发了一个网站，上面展示了我多年来拍摄的数千张照片。到目前为止，我对方向没有任何问题--横向和纵向图片都可以正确显示。
我最近开始编辑一些照片，这改变了他们的一些方向。我现在已经修改了我的代码来处理EXIF的'Orientation‘数据(使用了Wes在Stack Overflow上创建的函数'correctImageOrientation’-非常感谢Wes!)相应地旋转照片，它工作得很好。
但是，我编辑的一些照片现在没有EXIF方向数据，所以我不能使用它来旋转照片，但文件资源管理器不知何故知道正确的方向，并正确地显示照片。因此，我的问题是，文件资源管理器从哪里获得照
浏览 1提问于2019-04-08得票数 1
2回答
我正在使用ImageCapture api从用户设备的摄像头中捕获屏幕快照。
问题是在android上拍摄的照片被错误地旋转了。它们在图片预览中、上传图像之前和上传后都被错误地旋转。
我的计划是从我从图像捕获获得的blob中读取exif数据，在exif中找到方向，并使用javascript正确地旋转图像，但是没有可用的exif数据，因为它不是jpg。
我的代码：
function takePhoto(img) {
imageCapture.takePhoto()
.then(blob => {
// EXIF.getData(blob, function() {
//
浏览 4提问于2019-11-06得票数 0
回答已采纳
我使用文件阅读器读取用户上传的图像，根据图像的宽度和高度调整画布的大小。
var img = new Image();
img.src = e.target.result;
var canvas = $('#test-canvas')[0];
$('#test-canvas').width(img.width);
$('#test-canvas').height(img.height);
然后我将图像绘制到画布上。
var ctx = canvas.getContext('2d');
ctx.drawImage(img, 0, 0
浏览 5提问于2015-07-29得票数 0
1回答
我的问题是，当exif数据不存在或没有旋转值时，如何检测图像方向。
例子:手机照片
<?php echo exec('exiftool -Orientation file 2>&1');
// MOBILE -> returns -> Orientation : Rotate 90 CW
// DSLR -> returns -> empty ?>
当我试着这个
echo exif_read_data($multimedia_newPATH)['Orientation']
// Mobile Phone -&g
浏览 0提问于2019-07-10得票数 2
1回答
我正在评估一个移动网络应用程序使用画布的图像上传技术。关键是读取EXIF数据客户端.指向优秀的。我特别想从EXIF中提取：
拍摄日期及时间
地理定位.拍摄照片的经纬度
在Windows上的Firefoxv.33.1上测试Blueimp脚本，使用在iPhone上拍摄的照片(带有地理数据)，它成功地提取了所有EXIF数据，包括日期、时间和地线。在iOS上使用相同的照片运行相同的测试，它只提取少量的EXIF数据--只是尺寸和方向(我使用的是iPhone 5，iOS 8.1)，没有别的。为什么会这样？是否推荐修复或替代JavaScript EXIF提取工具？
收到的建议非常感谢，因为这
浏览 0提问于2014-11-21得票数 4
3回答
我有代码可以批量调整数码照片的大小。
有些照片是在肖像方向拍摄的。
对于肖像方向上的照片，我必须旋转它们。
我使用以下C#代码旋转照片：
bmpOrig.RotateFlip(System.Drawing.RotateFlipType.Rotate90FlipNone);
bmpOrig.Save(filename, ImageFormat.Jpeg);
它工作得很好(在web浏览器中显示我想要的方式)。
但是，如果我在Photoshop (和HP照片查看器)中看到新的图像，它就会显示旋转。
我做了很多研究，我相信有EXIF数据，标志着图像旋转。
我的问题是:如何重置这些EXIF数据以指示图像
浏览 0提问于2012-05-05得票数 3
我需要在我的应用程序中将照片从相机上传到服务器。它在大多数设备上都工作得很好。但是一些设备导致图像旋转90‘，这不是我想要的行为。经过研究，我了解到这是由于EXIF数据附带的图像。为了从图像位图中剥离EXIF数据，我尝试了各种方法，如重新调整图像大小等，但都不起作用。任何人，请建议一种方法来完成这项任务。
浏览 0提问于2014-10-20得票数 1
1回答
当我在Chrome 81+中调用context.drawImage时，它会自动旋转图像。我想禁用它。我可以在img标签中使用image-orientation:none禁用它，但这在画布上不起作用。
它似乎忽略了图像导向风格。在下面的示例中，img标记不会自动旋转(如预期的那样)，但画布会自动旋转，尽管试图禁用它。
如何防止drawImage基于exif数据旋转，或者至少检测到它已经这样做了？
<html>
<head>
<script>
window.onload = function() {
var c = document.
浏览 18提问于2020-06-07得票数 5
回答已采纳
1回答
看起来，当从iOS设备上拍摄一张HDR照片时，因为苹果不会旋转图像并将它们全部拍摄，所以会有EXIF元数据(特定方向)告诉其他软件如何呈现这张照片。
当有人试图发送/共享/使用/上传由相机拍摄的原始iPhone HEIC图像的调整大小版本时，就会发生这种奇怪的情况。
OS调整大小的工具扰乱了宝贵的EXIF方向元数据，因此我们只剩下一个没有旋转的图像，并且不包含任何元数据来正确地显示它。
我们有一个php服务器，它接收从人们上传的这样的照片，他们中的许多人抱怨通过webview上传大小调整的照片，并得到一个混乱的方向。
不知道如何解决这个问题，考虑到我们最终得到的照片有一个exif方向
浏览 2提问于2021-03-16得票数 2
4回答
我有一个应用程序，可以使用本机Camera捕捉照片，然后将它们上传到服务器。我的问题是，所有的照片都有一个EXIF方向值为0，这扰乱了其他地方的显示。
如何更改EXIF方向？我不是在寻找一种方法来纠正它的每一种情况，只是改变它为一个不同的价值。
我用的是三星Galaxy Note 4
我尝试过这样的解决方案，在拍照前设置相机的方向：
Camera c = Camera.open();
c.setDisplayOrientation(90);
Camera.Parameters params = mCamera.getParameters();
params.setRotation(0); /
浏览 16提问于2016-09-08得票数 28
回答已采纳
2回答
画布正在绘制旋转的图像。
、、、、
我正在尝试使用javascript用我的iphone拍摄一张照片，并将图像绘制到画布上。我使用
<input type="file" capture="camera" accept="image/*" id="takePictureField">
mobilePictureGet);
用相机。一旦我选择了一张照片
document.getElementById("takePictureField").addEventListener('change', function(e) {
浏览 3提问于2015-08-20得票数 4
回答已采纳
2回答
我正在编写一个uses应用程序，它加载图像并在画布上显示(更准确地说，我正在编写一个使用HTML5/JavaScript的Tizen应用程序)。
我可以正确地加载图像：
function loadImage(file) {
var img = new Image();
img.src = file;
return img;
}
一切正常，直到我开始得到的图像显示在错误的方向。我想知道如何获取EXIF和方向，我想知道如何更改上面的函数以返回正确的图像？
function loadImage(file) {
var img = new Image();
im
浏览 1提问于2015-12-04得票数 0
我正在使用干预包来处理使用Laravel构建的移动web应用程序中的文件上传。 我有一张exif方向为8(横向)的照片 当以完整大小上传此文件，然后使用干预的orientate() $img = Image::make($file);
$img->orientate(); 它工作得很好，可以正确地旋转照片。 但是，如果在iOS中，您在上传之前从图片库中选择了“选择图像大小”(为了上传较小的照片)，exif数据会将其报告为EXIF orientation = 1，但图像会横向显示(无论您是否对其应用orientate() )。 我很想听听其他人是如何处理这种iOS怪癖的。
浏览 23提问于2020-04-10得票数 2
我在使用JavaScript解码条形码时遇到了HTML5应用程序的问题。出于测试原因，我在一个包含1055张图片的数据库(分辨率为600x800px的Muenster BarcodeDB )上运行了实现的算法。它在Windows上的Chrome和iPad 2上的Safari上运行得很好，但我的Moto G(安卓)上的Chrome在20-30张图片没有任何提示的情况下崩溃了。当我使用HTML5媒体捕捉相机的照片，它也崩溃后，拍摄了几张照片和Chrome报告，没有足够的内存来进行之前的操作。当照片被拍摄并关闭相机应用程序时，它会直接崩溃。然后，浏览器再次显示页面的重新加载。
有没有人面临同样的问题
浏览 0提问于2015-01-22得票数 1
以前，当使用iPad上的html文件输入控件来拍摄照片时，基于使用exif.js提取的方向元数据值，FileReader将总是以横向返回html格式的图像，并且因此将在事实之后旋转。 然而，现在在运行iOS13.5.1的iPad上不再是这样了，返回的图像与相机拍摄照片时的方向是相同的，这将是非常好的，除非它仍然包含元数据标签，这告诉我它仍然需要旋转，最终结果是过度旋转的图像。 坦率地说，我不确定该怎么做，因为任何试图修复这个问题的改变都会破坏ios所有其他版本的功能。在下面的示例中，显示的图像直接来自相机，文本输入指示它应该如何旋转。我想得越多，我就越确信这实际上是ios的一个缺陷，而不是我
浏览 9提问于2020-06-11得票数 0
回答已采纳
1回答
假设我将可变的可绘制对象放在画布上的不同位置。我愿意旋转每个图像的形式(一定的角度)。所以我需要在画布上旋转可绘制的代码。问题是，任何可绘制图形的旋转都不能反映到画布上的另一个可绘制图形。
浏览 1提问于2013-03-07得票数 2
2回答
有没有办法通过Javascript旋转HTML5画布的现有内容？我知道可以将将要绘制到画布上的图像旋转，但我希望旋转已绘制到画布上的内容，例如，400x400画布的200x200角，或现有画布的任何特定区域。
同样的问题来缩放现有的画布内容.
我知道getImageData/putImageData提供了转换像素数组的潜力，但它太慢，效率太低。
浏览 0提问于2011-12-15得票数 8
使用带有IOS6的safari移动浏览器，文件上传功能为用户提供了拍摄照片的选项。不幸的是，在拍摄照片时，虽然照片缩略图在浏览器中正确显示，但当您上载到服务器时，文件会旋转90度。这似乎是由于iphone设置的exif数据造成的。我有代码，可以在发球时通过旋转图像来修复方向。然而，我怀疑保存旋转后的、正确定向的图像会更好，这样我就不必再担心方向问题了。我的许多其他照片甚至没有exif数据，我不想弄乱它，如果我可以避免它。
有没有人能建议一些代码来保存图像，使其方向正确？
以下是旋转图像的代码。下面的代码将显示正确定向的图像，然而，我想要做的是保存它，这样我就可以在任何时候使用它，而不用担心方向
浏览 1提问于2013-01-15得票数 1
5回答
我有一张用iphone拍摄的JPEG图像。在我的桌面PC (Windows照片查看器、Google Chrome等)上，方向不正确。
我正在开发一个ASP.NET MVC3Web应用程序，我需要在其中上传照片(目前使用的是plupload)。
我有一些处理图像的服务器端代码，包括读取EXIF数据。
我尝试过读取EXIF元数据中的PropertyTagOrientation字段(使用GDI - Image.PropertyItems)，但该字段不存在。
因此，它要么是一些特定的iphone元数据，要么是其他一些元数据。
我使用了另一个工具，比如Aurigma Photo Uploader，它可以
浏览 2提问于2011-06-03得票数 61
回答已采纳
佳能单反相机似乎保存照片的景观方向，并使用exif::orientation进行旋转。
问题：如何使用exif定位数据将图像重新保存到预定的方向，从而不再需要exif数据以正确的方向显示？
浏览 5提问于2013-10-18得票数 106
回答已采纳
1回答
我已经寻找了很长时间的原因，为什么在画布元素上绘制、擦除和重绘旋转的矩形在mac上的google chrome中不起作用。
我需要这个，因为我想在画布上渲染一个悬停覆盖。
我已经创建了一个代表我的代码的提问器：
Html：
<canvas id="canvas" width="400" height="165" style="left: 0px; top: 0px; background-color:red;"></canvas>
Javascript：
var canvas =null;
var ctx
浏览 2提问于2012-10-05得票数 5
回答已采纳
我需要使用毕加索库显示图像，保持原来的方向。我使用相机或画廊拍摄照片，然后使用Volley上传多幅图像到服务器。
问题是当图像被加载时，它们会被旋转，即方向是错误的。
如何在从服务器加载的纵向或横向模式下旋转图像？
Picasso.with(getApplicationContext()).load("http://:www..." + url).into(imageView);
我试图使用PHP从服务器上的图像中获取exif方向，但没有指定方向。
浏览 1提问于2017-04-21得票数 1
2回答
我正在开发html5画布应用程序，在画布上绘制矩形。
画布是格子到中心位置，使用fillRect函数绘制矩形画布相对于其父div是绝对位置。当画布处于原始位置时，它的工作是正常的，但当我旋转画布90/180/270度时，我无法联系点，点击屏幕，在画布上画点。当画布处于原来的位置时，我可以得到点点击屏幕，然后把那个点转到画布上，根据我的翻译位置画矩形。但是当我将画布旋转90/180/270度时，我无法将屏幕点转换为画布点。因此，形状是在奇数/不同位置绘制的，然后由用户实际单击.。
我的问题是：
当画布旋转时，如何将屏幕上点击的点按照其旋转情况转换为画布绘制点。
浏览 1提问于2012-02-27得票数 6
1回答
我正在研究一个解决方案来解决这个问题，在这个问题中，由于exif数据中有方向，从某些手机制作的图像出现侧向或倒置。到目前为止，我已经得到了方向，但是这个变量没有在下一个旋转步骤中及时传递回来。 function getOrientation(image){
let ort = 1;
EXIF.getData(image, function () {
ort = EXIF.getTag(this, 'Orientation');
});
return ort;
} 来自ort的值稍后将与画布结合使用，以旋转上传的图像。如下所示，但
浏览 17提问于2020-05-01得票数 0
回答已采纳
我有一组通过ftp上传到/Photos的照片(有些是.JPG，.jpg，.png等)，但并不是所有的照片都被正确旋转了。我有一个php脚本，可以告诉我它们需要旋转多少才能正确旋转(风景/肖像)，但我似乎不知道如何保存它们或进行实际的旋转。 我试过了 //define image path
$filename="image.jpg";
// Load the image
$source = imagecreatefromjpeg($filename);
// Rotate
$rotate = imagerotate($source, $degrees, 0);
//and
浏览 41提问于2019-10-13得票数 0
回答已采纳
我需要一个统一的c#脚本，可以从照片读取EXIF的横向/纵向数据。我想在那个位置放置一个posTransform。不确定这在Unity中是否可行。我想将我的图像加载到unity中，并有一个脚本读取EXIF: 1-GPS经纬度/长，2-旋转，3-时间戳从照片。我还没有找到任何信息说这可以在unity内完成，然而，我读到了关于exiflib github项目和unity之外的其他方式。
提前感谢您的帮助
浏览 2提问于2016-11-23得票数 1
我的应用程序拍摄照片，进行一些处理，并确保它们包括在Android图库中。
我遇到的问题是，当我打开图库中的图像时，它们没有正确地旋转--尽管检查Exif数据显示方向标签已经设置并且看起来是正确的。如果我将它加载到Exif考试工具中，它会说“方位:旋转90 CW”，但我注意到其他应用程序，如Gimp，似乎也错过了Exif数据，所以我想知道数据在存储时是否有问题。
我的Exif定向代码如下所示：
private void writeOrientation(int orientation, String path) {
try {
int exifO
浏览 0提问于2018-12-10得票数 3
1回答
我已经实现了一个自定义相机，我从它拍摄照片，保存它，插入到媒体商店，并立即显示它之后，我一直被保存的图像方向的问题所困扰，我试图使用ExifInterface直接使用filePath或使用来自安卓图像内容提供商的方向来解决这个问题。
方向总是返回为0。我已经使用过：
private int getExifOrientation(String pathName)
{
//for complete info on EXIF orientation visit: http://sylvana.net/jpegcrop/exif_orientation.html
ExifInt
浏览 24提问于2013-09-27得票数 1
2回答
在我的web应用程序中，用户可以在手机上从输入类型文件中拍照。 之前我使用js load image库自动检测EXIF数据，并在必要时旋转它。 现在我已经切换到fabric.js库，因为我想让用户在上传之前可以在画布上绘制图像。 问题是，我不知道如何获取图像exif数据，或在使用fabric.js时旋转图像。 我的代码： 从索引数据库中获取图像 var image;
localforage.getItem('photo').then(function(value) {
image = value;
// THIS IS OLD
浏览 25提问于2020-01-22得票数 0
回答已采纳
我有一个网站，用户可以上传自己的照片。这些照片中有许多是用手机拍摄的，因此很多照片都是垂直的，但由于Drupal忽略EXIF数据，所以它被上传为水平图片。可以使用Image操作模块(autorotate子模块)来修复这个问题，但是如果这样做了，就会破坏人工作物模块，我可以根据需要使用该模块来修剪图片。
如果有可用的EXIF数据，是否可以让Drupal在上传时自动旋转所有图像，以便将图像样式应用于旋转图像，而不是原始图像？
浏览 0提问于2013-01-07得票数 0
1回答
EXIF和缩略图
、、
我在做一个照片查看器。在这种情况下，我编写了一个小类，以便能够读取和使用一些EXIF数据，例如图像定向。这门课的阅读效果很好。
但是，我会添加一个新的选项来旋转照片。我想旋转和写入照片数据本身，而不仅仅是重写定位标签。我已经编写了代码来旋转和保存主要的JPEG图像，并且运行良好。但我也需要旋转包含在EXIF数据中的缩略图，如果有的话，以保持图像的一致性。因此，我需要写入EXIF数据，以替换现有的缩略图。
但这引发了一些问题，我很难回答，即：
EXIF数据可以包含超过一个缩略图，如果是，图像可以包含的最大缩略图计数是多少？
缩略图的支持格式是什么？(我找到了JPEG和TIFF，还有其他的
浏览 2提问于2015-09-10得票数 6
回答已采纳
2回答
就像这样简单的正方形：
我希望正方形旋转，任何角度，显然保持相同的尺寸。我将在画布上绘制多个方块(从0到100+)，所以我不认为转换/旋转画布是可行的，因为每个sqaure都有自己的角度。有什么好办法吗？
浏览 10提问于2022-10-06得票数 -2
回答已采纳
我正在编写一个相机应用程序，当我拍摄一张照片时，我会收到一个字节[]，将其解码为位图并旋转，然后保存到JPEG中。我使用本机库旋转照片，但是位图仍然从byte[]解码到内存中(仍然允许我保留1位图而不是2位图)。从本质上说，在我的代码中有一个地方，我需要大量的内存和OOM，在堆很低的设备上，摄像头是愚蠢的-百万像素。有什么建议吗?如何在不影响图像质量的情况下解决这个问题？
我不认为我想使用largeHeap="true"，我应该忘记旋转和设置EXIF吗？
此外，我也不那么热衷于“预测”我是否会有OOM，因为数学没有加起来：
浏览 0提问于2015-05-15得票数 1
回答已采纳
我想根据JPEG EXIF图像数据中相机设置的原始旋转来旋转照片。诀窍在于，所有这些都应该使用JavaScript和<canvas>在浏览器中实现。
JavaScript如何访问JPEG、本地文件API对象、本地<img>或远程<img>、EXIF数据来读取旋转信息？
服务器端的答案是不好的；我正在寻找，一个客户端解决方案。
浏览 156提问于2011-09-28得票数 136
回答已采纳
3回答
我正在尝试实现一个自定义画家，它可以在画布上绘制一个图像(缩小版本)，并且可以旋转和缩放绘制的图像。
我了解到，要缩放图像，我必须使用缩尺方法来缩放画布。
现在的问题是如何旋转缩放图像的中心(或任何其他点)。画布的旋转方法只允许在左上角旋转.
浏览 0提问于2018-07-13得票数 10
回答已采纳
2回答
从byte[]读取EXIF-数据
、、、、
我目前正在尝试以字节数组的形式从照片中获取EXIF数据。该照片是直接从相机拍摄的，因此只能作为上述byte[]使用。
现在有很多可提取EXIF的库--然而，这些库只接受BufferReader，或者更糟糕的是只接受FileStream。鉴于我遇到了困难，我愿意使用BufferReader将byte[]提供给库。但不幸的是，我不知道有什么捷径，也不想仅仅为了使用byte[]而实现我自己的BufferReader。
此外，我希望不必将byte[]写入存储，然后再次读取它以获取EXIF信息，因为我希望相应地旋转它并保存结果。因此，第一次保存文件将是不合理的，因为我将以方向校正的形式保存该图像。
任何
浏览 2提问于2012-08-24得票数 2
回答已采纳
1回答
如何旋转要绘制到画布上的图像？
、、、、
因此，有了画布和canvasContext，我想在画布上多次绘制图像
所以我有这样的代码：
var img = new Image();
img.src = 'http://superior0.narod.ru/5050.png';
function drawLine(g, n, x1, y1, x2, y2){
g.drawImage(img,x1,y1,10,10);
}
在这里，我不旋转图像。我需要它被旋转的形式如何线将被旋转，如果绘制从点x1，y1到x2，y2。
如何在HTML5和Javascript中做这样的事情？(只需使用一个画布)
您可以在acr
浏览 2提问于2010-12-24得票数 0
回答已采纳
我在一个项目中工作，我需要上传照片到画布，但问题是，当用户从iphone上传图像时，图像会自动旋转90度。
有没有办法用Javascript检查图像的方向？如果我可以旋转图像，如果它的方向不是法线(水平)？
提前谢谢。
浏览 0提问于2013-11-05得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
