I'm trying to create a PDF document from images of varying sizes so that each page of the PDF displays one of the images unscaled, the page size should fit the image dimensions.
I'm using Prawn to generate the PDF from a list of image file names. To get the image dimensions I use FastImage.
Prawn::Document.generate('Output.pdf') do
list_of_image_filenames.each do |i|
image_size = FastImage.size(i)
start_new_page(:size => image_size, :layout => :portrait)
image(i)
end
end
To test it I'm using three PNG files of dimensions 560x560, 600x600, and 600x600. I've made sure that FastImage returns the correct image dimensions.
The resulting PDF (Preview tells me it's PDF version 1.4) looks like this:
It starts with 3 empty pages (one of which is probably due to the fact that I didn't put anything on the first page), then the first image, which is cropped. Except the first one, which I'm ignoring for now, these pages are of size 560x560 px, according to Preview.
Next are two empty pages, then the second image, which also doesn't fit on the page. These pages have dimensions 600x600 px.
Finally, two more blank pages and the third image, cropped again, page dimensions also 600x600 px.
Here is a sample of one of the cropped images; the original image is a complete rounded rectangle with the digit "1" inside.
Why do the images not fit on the page? How can I put the individual unscaled images on pages fitting their dimensions?
May not be an exact answer but Probably too long for a comment. I have a few suggestions:
Have you tried specifying image size and position? e.g.
image(i,position: :left, vposition: :top, fit: image_size)
This will place an image in the top left corner of the document an will force it to fit in dimensions of the image_size Array. This might help with the cropping.
Also when setting page_size you need to pad for margins otherwise the image will not fit because it is outside the writable area try something like
image_size = FastImage.size(i)
#default margins are 0.5 inches so pad both height and width with 1 inch using in2pt
page_size = image_size.map{|p| p + in2pt(1) }
start_new_page(:size => page_size, :layout => :portrait)
I cannot guarantee this will work and it has not been tested but usually overflow onto additional pages has to do with the fact that you cannot place a specific object inside the bounds so padding the page size should help.
https://github.com/boazsegev/combine_pdf
you could try this gem.
cropped_size = [X0, Y0, X_max, Y_max]
combine_pdf = CombinePDF.new(pdf_path)
combine_pdf.pages.each{|page| page.crop(cropped_size)}
combine_pdf.save(new_pdf_path)
Related
I have 2 images, with same dimension and same picture, a shape.
In the first image (that I show on screen), the shape is monocromatic, in the second image, shape is mapped with different color.
When I move the mouse, on the image, I want to show different text based on the color mapped on second (hidden) image.
I don't want to map square area, but irregular areas, this is my problem.
For example, when mouse cursor is on head (right image), I get color red on the left image (cached but not visualized) and I put a specific text.
How can I load second image an get pixel color? Gosu doesn't permit to get image info (only width and height).
Any ideas?
At the end I choose this GEM chunky_png, because it has no dependency from other gems or library and it's perfect to my needs:
#map_image = ChunkyPNG::Image.from_file('map_shape.png')
# Test pixel color
if #map_image[mouse_x - #main_image_x, mouse_y - #main_image_y] == ChunkyPNG::Color.rgb(255, 0,0)
# Do something
end
I have read a image like that
a = imread('test.jpg');
image(a)
what the test.jpg is:
but after the image function
the result is:
and I don't know why it show that?
Because I want to crop some part, so I have to see the image shown.
How to fix it by showing the human face by image?
You are using image command to display an image. From here: "image creates an image graphics object by interpreting each element in a matrix as an index into the figure's colormap or directly as RGB values". Since you are providing a 2-D matrix, each element is interpreted as the index to the figures colormap. You can see the figure's colormap by using
c_map=colormap;
Also, the axis is set to square, therefore you see a circle instead of an ellipse. Use imshow(a,[]) to display the grayscale image as desired.
You image data might be in a color map instead. try [a,cmap] = imread(...). If cmap is not empty, a is indices into cmap, and cmap contains the actual colors.
Use img = cat(3,cmap(a,1),cmap(a,2),cmap(a,3)) to get your image, and show it with image(img).
Note that using imagesc might be misleading in this case as it will still show something that looks like your image when simply doing imagesc(a). This as different pixels colors are associated with different index-values in a.
I have a Content Slider (All-in-one-banner sort of) on the home page of my website.
Every time this banner slides onto the next image in the queue, the other images (png format) on my page are getting pixelated. Especially it happens in Chrome.
Images and Icons such as the logos, icons used for navigation, etc... - they get pixelated when a new slide changes on the banner.
Please help me.
Demo link (Open in chrome):
When the slides in the banner change, Look at the logo on the top and the logos to the right, and also the profile pics below,: indiaemerge.com/ieys2013
The solution I could figure out is that one should NOT use an image with large dimensions.
For example: I was trying to use an image of size 800px X 400px to fit it into a division of 200px X 50px. Because of this the image was getting distorted when slides would change.
I reduced the dimensions and resolution of the image to match the target division's dimensions and it worked.
Another way to fix this is to use an svg image file.
So the lesson to be learnt here is that always try to use an image (in case it is png or jpg) whose size meets your requirement as precisely as possible. If it is an svg image file then there won't be any problem.
I am making a responsive portfolio website using WordPress. I have a small issue that is breaking the layout. All images are meant to be 300px wide by 200px high.
I have also used the WordPress API to crop images if the user uploads images that are larger than the above mentioned dimensions
add_image_size( "portfolio", 300, 200, true );
What this does for me is that it inserts the width="300" and height="200" attributes to the images automatically (but the original dimensions of the image stay the same they are just being resized) This works well except when i try to resize my browser window..
Here is a senario: The client uploads an image with dimensions 300px wide and 210px high.. initially it is being resized and shown hence the layout is perfect but when i resize the browser the images gets resized as well but with respect to its "original dimensions".. hence the image with the original height of 210px is larger that the rest of the images.. and as i am floating all the images to form a 3 column layout the difference in height breaks the layout (shifting the column below this large image to the right and leaving an empty column below itself.)
How do i fix this issue? I thought of using timthumb to resize all images before they are display.. hence changing the original dimensions of the image on the fly but i think this is not an efficient way? Any other solution to this problem ? Also i dont want to using anything like jQuery Masonry as i have a specific layout to maintain.
Thanks
You can use the max-height rule from css to limit the height of all images equally.
eg:
.gallery img{
max-height: (some height);
}
Use % or em for the height, pixels might not work as well in a responsive design.
How do I create thumbnail form original size (any size) to 50 x 50 (fixed size) link text
when add images to lightbox all images in any size will resize to 50 x 50 dimention how to implement that with codeigniter image class ;
imagine I have image with 600x320 dimensions when i re size it with maintain_ratio "on" it's gave me 50x27 dimensions when i re size it to 50x50 . anyway if I turn maintain_ration "off" it's resized nicely to 50x50 but output is deformed
I'm not exactly sure what you are asking. Do you want to resize an image to 50x50 or do you want to create a lightbox effect. To resize simply follow the instructions in the user guide. They're very straightforward: http://codeigniter.com/user_guide/libraries/image_lib.html
If you want to create a lightbox then you will need to use JavaScript not codeigniter. There are loads out there to choose from for different js frameworks if you don't want to build your own.
Hope that helps.