Photos being uploaded incorrectly - angularjs

We are using Html, AngularJs 1.6.X, Dropzone.JS 4.3, Load Image and Azure Blob Storage.
On the client-side images are:
Rotated according to their EXIF information
Resized with a max size of 1280 x 960
Uploaded to Azure Blob Storage
There are occasions where images are being uploaded zoomed-in to the top left corner.
Any ideas on how to diagnose and fix the issue?
Thanks in advance.

After some attempts I was able to pinpoint the issue to the scaling method of Load-Image.js.
I am not sure of what is causing the issue but replacing the library by another, a custom version of Image-Uploader, fixed the issue.
Hope this helps someone else.

Related

Add Image over another image and save it

I am working on a react project in which we generate new images by fitting uploaded image in a tv screen, or laptop screen or mobile screen. So what I want is a way in which I can place the uploaded image into this below image
In the black tv screen I want the uploaded image to fit and below there will be download option to download the uploaded image.
I searched for that and came across cloudinary react library. So I wrote this code to somehow fit an image inside this image but I can't seem to find any way to download that image.
If you have any idea of doing this please share with me.
Thank You in advance
You can overlay images on other images without having to use a particular Cloudinary SDK, as outlined here: https://cloudinary.com/documentation/image_transformations#adding_image_overlays
You can then place them more specifically using x and y coordinates in the URL as outlined here: https://cloudinary.com/documentation/image_transformations#placing_overlays
Once you have generated an image with the overlay positioned correctly (and with any other transformations you may wish to process), you can download the generated image as normal.

Where to store image if the image is used in two different websites

I want to upload the image in my website. The same image will be shown in another website. So this is the scenario where image is uploaded in one website and displayed in both website. These two websites are hosted in two different servers as well as they both have their own database.
I am using Angular JS, Entity Framework, Web API and SQL Server 2014 as backend for both of the website. Currently I am using ngFileUpload to upload the images. Please answer me on below questions:-
Should I upload the image in database(as nvarchar-max) or filesystem(FTP or local web server file system)? I read many articles and get to know that Database retrieval of image has affect on performance but it is more secured. However File System is easy in performance but complex on maintenance like back ups. So I am just not able to decide which to choose among these two as both have pros and cons. Which option will be more suitable to my requirement where same image will be displayed in both website. Please note that there can big images like upto 5 MB uploaded in the application but the number of images will not be huge as compare to any social networking or online shopping site.
How to create different size of images(thumbnail, medium, large etc) automatically upon uploading of image in website? Is there any tool or directive already available in Angular JS to achieve this?
I know my question is broad but I need suggestion to start with my requirements.
Please help.
I use the file system to host my images. If the image is displayed on someone's computer screen, they can use an image capturing software to copy it anyway. Also, while storing them to a database may be more secure, I don't need the extra overhead in my code where a simple url to retrieve the image will suffice.
As for resizing an image using Angular, check out these links:
https://www.scientiamobile.com/page/angular-image-resize
https://github.com/FBerthelot/angular-images-resizer

Ionic crosswalk app async image loading from filesystem

I use ionic 1.3.1 for my data-driven android app with crosswalk (~14 version I guess).
I have about 3k+ of full images and 3k of their thumbnails (I did that so it woudn't resize images as user scrolls. p.s. was that a bad idea and I shouldn't do that?) in www/img/ folder and I'm displaying them with ionic's "collection-repeat".
It all works great, but the app takes around 5 seconds to load itself and takes up to 70-100 mb of ram while running.
Can I async load images from filesystem ?
If so where do I put them, so they would appear in my apps folder after I build the project and how do I reference the path to each of them from code with src attribute? I guess the other way would be to make a webserver from which user downloads all the images on the first start and then store them in the apps folder, but I don't have any experience with this kind of stuff, so I would prefer the first option for now.
Please, give me some tips on how to implement this or suggest other ways to solve the problem.

Pivotviewer showing cached images

I am making Silverlight 5 application using pivotviewer, trying to load images in pivotviewer which are received from server. Now pivotviewer is showing old cached images.
DZI images at the server side has already refreshed.
How to remove the cached images shown by pivotviewer.
Any help is appreciated.
Thanks in advance
Tom
I am assuming that you are talking about a browser refresh (or something similiar) is still pulling the old cached images from a previous deep zoom collection? If so, this is an IIS setting (or more correctly a web server issue).
Take a look here for how to disable caching : IIS 7 Force Fresh Images
If you are having a different issue, please let me know.

How to save esri map as an image file

I am using Silverlight 3 and I am trying to take a screenshot of esri map.
I was able to take a screenshot and save as a file for silverlight controls, but when I try to access Esri map image, I get "Pixel access not allowed" error. I heard this is because of different domain (I am trying to get map image on the client side, and map image is not accessible at server side in my silverlight application).
So I am trying to find a function from esri so that I can save the map image as a file.
does anybody know how to do this? or any other way around?
I am using a script from the Code Gallery for both printing and exporting map images.
The script requires a little bit of tweaking to get it to work (plus you need to dig a little bit into WCF and self-hosted services), but it has been working great for several months now. You can see it in action at our web site.

Resources