Tôi có một số base64 img encoded
mà bạn có thể tìm thấy here. Làm thế nào tôi có thể nhận được chiều cao và chiều rộng của nó?JS - lấy chiều rộng và chiều cao hình ảnh từ mã base64
Trả lời
var i = new Image();
i.onload = function(){
alert(i.width+", "+i.height);
};
i.src = imageData;
Tạo ẩn <img>
bằng hình ảnh đó và sau đó sử dụng jquery .width() và. chiều cao()
$("body").append("<img id='hiddenImage' src='"+imageData+"' />");
var width = $('#hiddenImage').width();
var height = $('#hiddenImage').height();
$('#hiddenImage').remove();
alert("width:"+width+" height:"+height);
Kiểm tra ở đây: FIDDLE
hình ảnh không tạo ra ban đầu ẩn. nó được tạo ra, sau đó bạn nhận được chiều rộng và chiều cao và sau đó loại bỏ nó. Điều này có thể gây ra khả năng hiển thị rất ngắn trong các hình ảnh lớn trong trường hợp này, bạn phải bọc hình ảnh trong một vùng chứa khác và làm cho vùng chứa đó ẩn không phải hình ảnh.
Một Fiddle mà không thêm vào dom theo Anser gp của:. HERE
tôi thấy rằng việc sử dụng .naturalWidth và .naturalHeight có kết quả tốt nhất.
var img = new Image();
img.onload = function() {
var imgWidth = img.naturalWidth,
imgHeight = img.naturalHeight;
};
Điều này chỉ được hỗ trợ trong trình duyệt hiện đại. http://www.jacklmoore.com/notes/naturalwidth-and-naturalheight-in-ie/
Để sử dụng đồng bộ chỉ cần quấn nó thành một lời hứa như thế này:
function getImageDimensions(file) {
return new Promise (function (resolved, rejected) {
var i = new Image()
i.onload = function(){
resolved({w: i.width, h: i.height})
};
i.src = file
})
}
sau đó bạn có thể sử dụng đang chờ đợi để có được các dữ liệu trong đồng bộ kiểu mã hóa:
var dimensions = await getImageDimensions(file)
- 1. Cách lấy chiều rộng và chiều cao của hình ảnh?
- 2. Lấy chiều cao và chiều rộng hình ảnh PHP
- 3. Làm thế nào để tìm ra chiều rộng hình ảnh base64 và chiều cao
- 4. XNA: lấy chiều rộng và chiều cao của màn hình
- 5. Chiều cao và chiều rộng hình ảnh không hoạt động?
- 6. Cách lấy chiều rộng và chiều cao của Chế độ xem hình ảnh trong Android?
- 7. Lấy Chiều cao và Chiều rộng Hình ảnh làm giá trị số nguyên?
- 8. Lấy chiều rộng và chiều cao của hình ảnh trong node.js
- 9. cách tạo chiều cao/chiều rộng hình ảnh tỷ lệ
- 10. Trích xuất chiều rộng, chiều cao, màu sắc và loại hình ảnh từ mảng byte
- 11. Lấy chiều cao hình ảnh bằng CarrierWave
- 12. Có thể lấy chiều cao/chiều rộng của hình ảnh không có trong DOM không?
- 13. Chiều rộng và chiều cao của giao diện người dùng jQuery dựa trên chiều rộng và chiều cao màn hình
- 14. ảnh Responsive vs xác định chiều rộng và chiều cao của một hình ảnh trong HTML
- 15. Tính Chiều cao cho Hình ảnh/Video dựa trên Tỷ lệ Khung hình và Chiều rộng
- 16. Lấy chiều cao/chiều rộng của cửa sổ WPF
- 17. Lấy chiều rộng của hình ảnh được tải bằng JavaScript
- 18. Internet Explorer 10 bỏ qua chiều rộng và chiều cao trên hình ảnh
- 19. Cách lấy chiều rộng/chiều cao của văn bản
- 20. GetSupportedPreviewSize trả về chiều rộng và chiều cao ngược
- 21. Cách lấy chiều rộng và chiều cao từ cửa sổ CreateWindowEx()? C++
- 22. Tăng chiều rộng và chiều cao của đầu ra gnuplot
- 23. La bàn: tạo Sprites, cộng với chiều rộng/chiều cao trên mỗi hình ảnh trong sprite
- 24. Chiều rộng và chiều cao của hình ảnh IE = 0 trước khi hình ảnh được tải xuống
- 25. Đặt chiều cao và chiều rộng Div (#Map) thành 100%
- 26. Nhận chiều rộng và chiều cao của hình ảnh trong mô hình trong HƯỚNG DẪN GIÚP GEM
- 27. Cách lấy chiều rộng và chiều cao thay đổi khi cắt xén bằng Jcrop và lưu bằng PHP GD
- 28. MKPinAnnotationView: Chiều rộng và chiều cao của pin
- 29. Chiều rộng và chiều cao của Menu Tùy chọn?
- 30. GLFW có chiều cao/chiều rộng màn hình không?
thật tuyệt vời, phải mất một nửa thời gian để kiểm tra kích thước, cảm ơn bạn rất nhiều! – bombastic
quá tệ đến mức đây là một quá trình không đồng bộ. –
@CoenDamen yep. Tôi cũng cần quá trình đồng bộ. –