Questions tagged [image]
The image tag is for questions related to the loading, formatting, saving, compression, and display of images in the context of source code. This tag should also be used for assistance using various image libraries. Questions about specific image formats should include the tags for those formats. Include tags to mention if the question relates to format conversion, processing, etc.
114,055
questions
2100
votes
33
answers
3.7m
views
How to auto-resize an image while maintaining aspect ratio
How do you auto-resize a large image so that it will fit into a smaller width div container whilst maintaining its width:height ratio?
Example: stackoverflow.com - when an image is inserted onto the ...
2080
votes
41
answers
578k
views
How to lazy load images in ListView in Android
I am using a ListView to display some images and captions associated with those images. I am getting the images from the Internet. Is there a way to lazy load images so while the text displays, the UI ...
1744
votes
39
answers
1.6m
views
Changing image size in Markdown
I just got started with Markdown. I love it, but there is one thing bugging me: How can I change the size of an image using Markdown?
The documentation only gives the following suggestion for an ...
1732
votes
37
answers
2.1m
views
How to vertically align an image inside a div
How can you align an image inside of a containing div?
Example
In my example, I need to vertically center the <img> in the <div> with class ="frame":
<div class="frame&...
1389
votes
44
answers
651k
views
Strange OutOfMemory issue while loading an image to a Bitmap object
I have a ListView with a couple of image buttons on each row. When the user clicks the list row, it launches a new activity. I have had to build my own tabs because of an issue with the camera layout. ...
1159
votes
14
answers
2.5m
views
How to display Base64 images in HTML
I'm having trouble displaying a Base64 image inline.
How can I do it?
<!DOCTYPE html>
<html>
<head>
<title>Display Image</title>
</head>
<body>
&...
934
votes
25
answers
1.7m
views
How to force image resize and keep aspect ratio?
I am working with images, and I ran into a problem with aspect ratios.
<img src="big_image.jpg" width="900" height="600" alt="" />
As you can see, height ...
891
votes
17
answers
1.9m
views
Changing the image source using jQuery
My DOM looks like this:
<div id="d1">
<div class="c1">
<a href="#"><img src="img1_on.gif"></a>
<a href="#"><img src="img2_on.gif">&...
777
votes
31
answers
477k
views
When to use IMG vs. CSS background-image?
In what situations is it more appropriate to use an HTML IMG tag to display an image, as opposed to a CSS background-image, and vice-versa?
Factors may include accessibility, browser support, dynamic ...
774
votes
21
answers
1.0m
views
How do I display local image in markdown?
Does anyone know how to display a local image in markdown? I don't want to set up a webserver for that.
I try the following in markdown, but it doesn't work:
![image](files/Users/jzhang/Desktop/...
770
votes
27
answers
1.2m
views
img src SVG changing the styles with CSS
html
<img src="logo.svg" alt="Logo" class="logo-img">
css
.logo-img path {
fill: #000;
}
The above svg loads and is natively fill: #fff but when I use the above css to try change it to ...
741
votes
33
answers
1.5m
views
How to get the image size (height & width) using JavaScript
Is there a JavaScript or jQuery API or method to get the dimensions of an image on the page?
732
votes
10
answers
234k
views
Image inside div has extra space below the image
Why in the following code the height of the div is bigger than the height of the img ? There is a gap below the image, but it doesn't seems to be a padding/margin.
What is the gap or extra space ...
722
votes
29
answers
1.7m
views
Change color of PNG image via CSS?
Given a transparent PNG displaying a simple shape in white, is it possible to somehow change the color of this through CSS? Some kind of overlay or what not?
712
votes
13
answers
1.1m
views
How to allow <input type="file"> to accept only image files?
I need to upload only image file through <input type="file"> tag.
Right now, it accepts all file types. But, I want to restrict it to only specific image file extensions which include ....
683
votes
24
answers
750k
views
Is it possible to set a src attribute of an img tag in CSS?
Is it possible to set the src attribute value in CSS?
In most cases, we use it like this:
<img src="pathTo/myImage.jpg" />
and I want it to be something like this
<img class="...
667
votes
25
answers
489k
views
Convert an image to grayscale in HTML/CSS
Is there a simple way to display a color bitmap in grayscale with just HTML/CSS?
It doesn't need to be IE-compatible (and I imagine it won't be) -- if it works in FF3 and/or Sf3, that's good enough ...
637
votes
25
answers
1.2m
views
How do I resize an image using PIL and maintain its aspect ratio?
Is there an obvious way to do this that I'm missing? I'm just trying to make thumbnails.
635
votes
21
answers
729k
views
How to make layout with rounded corners..?
How can I make a layout with rounded corners? I want to apply rounded corners to my LinearLayout.
603
votes
14
answers
337k
views
What are the different usecases of PNG vs. GIF vs. JPEG vs. SVG? [closed]
When should certain image file types be used when building websites or interfaces, etc?
What are their points of strength and weakness?
I know that PNG & GIF are lossless, while JPEG is lossy.
...
578
votes
19
answers
628k
views
Android: combining text & image on a Button or ImageButton
I'm trying to have an image (as the background) on a button and add dynamically, depending on what's happening during run-time, some text above/over the image.
If I use ImageButton I don't even have ...
566
votes
18
answers
1.2m
views
CSS Image size, how to fill, but not stretch?
I have an image, and I want to set it a specific width and height (in pixels)
But If I set width and height using css (width:150px; height:100px), image will be stretched, and It may be ugly.
How to ...
558
votes
22
answers
475k
views
Formula to determine perceived brightness of RGB color
I'm looking for some kind of formula or algorithm to determine the brightness of a color given the RGB values. I know it can't be as simple as adding the RGB values together and having higher sums be ...
497
votes
19
answers
814k
views
How to embed image or picture in jupyter notebook, either from a local machine or from a web resource?
I would like to include image in a jupyter notebook.
If I did the following, it works :
from IPython.display import Image
Image("img/picture.png")
But I would like to include the images in a ...
483
votes
20
answers
275k
views
Can an ASP.NET MVC controller return an Image?
Can I create a Controller that simply returns an image asset?
I would like to route this logic through a controller, whenever a URL such as the following is requested:
www.mywebsite.com/resource/...
476
votes
9
answers
903k
views
How do I convert a PIL Image into a NumPy array?
How do I convert a PIL Image back and forth to a NumPy array so that I can do faster pixel-wise transformations than PIL's PixelAccess allows? I can convert it to a NumPy array via:
pic = Image.open(&...
469
votes
23
answers
303k
views
Why does an image captured using camera intent gets rotated on some devices on Android?
I'm capturing an image and setting it to image view.
public void captureImage() {
Intent intentCamera = new Intent("android.media.action.IMAGE_CAPTURE");
File filePhoto = new File(...
457
votes
24
answers
539k
views
Refresh image with a new one at the same url
I am accessing a link on my site that will provide a new image each time it is accessed.
The issue I am running into is that if I try to load the image in the background and then update the one on ...
455
votes
20
answers
520k
views
How to do Rounded Corners Image in Flutter
I am using Flutter to make a list of information about movies. Now I want the cover image on the left to be a rounded corners picture. I did the following, but it didn’t work. Thanks!
getItem(var ...
448
votes
7
answers
606k
views
How do I get the picture size with PIL?
How do I get a size of a pictures sides with PIL or any other Python library?
447
votes
12
answers
357k
views
Image comparison - fast algorithm
I'm looking to create a base table of images and then compare any new images against that to determine if the new image is an exact (or close) duplicate of the base.
For example: if you want to ...
440
votes
19
answers
918k
views
Responsive image align center bootstrap 3
I do a catalog using Bootstrap 3. When displayed on tablets, the product images look ugly because of their small size (500x500) and a width of 767 pixels in the browser. I want to put the image in the ...
440
votes
11
answers
880k
views
Saving image from PHP URL
I need to save an image from a PHP URL to my PC.
Let's say I have a page, http://example.com/image.php, holding a single "flower" image, nothing else. How can I save this image from the URL with a new ...
431
votes
24
answers
955k
views
Saving a Numpy array as an image
I have a matrix in the type of a Numpy array. How would I write it to disk it as an image? Any format works (png, jpeg, bmp...). One important constraint is that PIL is not present.
426
votes
21
answers
967k
views
CSS Display an Image Resized and Cropped
I want to show an image from an URL with a certain width and height even if it has a different size ratio.
So I want to resize (maintaining the ratio) and then cut the image to the size I want.
I ...
415
votes
56
answers
848k
views
Storing Images in DB - Yea or Nay?
So I'm using an app that stores images heavily in the DB. What's your outlook on this? I'm more of a type to store the location in the filesystem, than store it directly in the DB.
What do you think ...
410
votes
11
answers
376k
views
How to generate a Dockerfile from an image?
Is it possible to generate a Dockerfile from an image? I want to know for two reasons:
I can download images from the repository but would like to see the recipe that generated them.
I like the idea ...
378
votes
9
answers
570k
views
Get image data URL in JavaScript?
I have a regular HTML page with some images (just regular <img /> HTML tags). I'd like to get their content, base64 encoded preferably, without the need to redownload the image (ie. it's already ...
376
votes
9
answers
607k
views
How to convert an image to Base64 encoding
How can I convert an image from a URL to Base64 encoding?
372
votes
11
answers
898k
views
How do I convert a numpy array to (and display) an image?
I have created an array thusly:
import numpy as np
data = np.zeros( (512,512,3), dtype=np.uint8)
data[256,256] = [255,0,0]
What I want this to do is display a single red dot in the center of a ...
370
votes
14
answers
1.2m
views
How to add an image to a JPanel?
I have a JPanel to which I'd like to add JPEG and PNG images that I generate on the fly.
All the examples I've seen so far in the Swing Tutorials, specially in the Swing examples use ImageIcons.
I'm ...
366
votes
19
answers
642k
views
Setting WPF image source in code
I'm trying to set a WPF image's source in code. The image is embedded as a resource in the project. By looking at examples I've come up with the below code. For some reason it doesn't work - the image ...
362
votes
9
answers
865k
views
How to create a video from images with FFmpeg? [closed]
ffmpeg -r 1/5 -start_number 2 -i img%03d.png -c:v libx264 -r 30 -pix_fmt yuv420p out.mp4
This line worked fine but I want to create a video file from images in another folder.
Image names in my ...
359
votes
17
answers
725k
views
How to resize an Image C#
As Size, Width and Height are Get() properties of System.Drawing.Image;
How can I resize an Image object at run-time in C#?
Right now, I am just creating a new Image using:
// objImage is the ...
358
votes
27
answers
481k
views
Inputting a default image in case the src attribute of an html <img> is not valid?
Is there any way to render a default image in an HTML <img> tag, in case the src attribute is invalid (using only HTML)? If not, what would be your lightweight way to work around it?
353
votes
7
answers
1.1m
views
CSS3 Rotate Animation
<img class="image" src="" alt="" width="120" height="120">
Cannot get this animated image to work, it is supposed to do a 360 degrees rotation.
I guess something's wrong with the CSS below, as ...
348
votes
5
answers
395k
views
Savefig outputs blank image
I am trying to save plots I make using matplotlib; however, the images are saving blank.
Here is my code:
plt.subplot(121)
plt.imshow(dataStack, cmap=mpl.cm.bone)
plt.subplot(122)
y = copy.deepcopy(...
340
votes
19
answers
717k
views
Capture Image from Camera and Display in Activity
I want to write a module where on a click of a button the camera opens and I can click and capture an image. If I don't like the image I can delete it and click one more image and then select the ...
337
votes
21
answers
378k
views
How do I force Kubernetes to re-pull an image?
I have the following replication controller in Kubernetes on GKE:
apiVersion: v1
kind: ReplicationController
metadata:
name: myapp
labels:
app: myapp
spec:
replicas: 2
selector:
app: ...
336
votes
14
answers
286k
views
Is there an equivalent to background-size: cover and contain for image elements?
I have a site with many pages and different background pictures, and I display them from CSS like:
body.page-8 {
background: url("../img/pic.jpg") no-repeat scroll center top #000;
background-...