I need a lib for react that takes an image (ex. 500w by 1000h following the baviour of object-fit: cover) and crops it to 256w by 144h
automaticly and serves it back to use at base64 format. English isn't my native language but I tried my best looking for this and only found libs that allow users to manually crop the image – I need an automatic procedure.
I've tried many libraries and the one that works best for me is smartcrop
It is very customizable (the most customizable I found).
You don't need NextJS to use it, you can use a simple node script.
Related
i have a website where i had a pdf preview as a react component, the pdf should be in real dimension, all works smooth until I start working on making the website responsive, I didn't know wt to do exactly with the pdf preview, I have an idea to scale the whole component up and down like we do with an SVG but idk if that's possible to do
I think you better use a library to preview the PDF.Since you want to make it responsive without affecting the preview.You may make use of libraries like react-pdf. This library may generate PDF files from a URL, a local file within the project, or a base64 encoded version.
And i found this article useful.
Hope this may help you!
And as you have mentioned you have some troubles installing react-pdf it's not very compatible with webpack5that is mostly due to Buffer dependency.
Refer to thsi :react-pdf issues
Without knowing the exact error, it's so difficult to help, so be more specific when you are asking questions.
I'm a newbie to codenameone. I'm trying to develop some image-processing app. I need to know if the image has geotagging information and eventually extract those. Is there a way to do that in CodenameOne?
I'm aware of the methods based on plain javax.imageio packages, but I know that those are not available in codenameone.
Thanks for any hints!
We don't have such an API as it's pretty different between Android/iOS. You can write something like this in pure Java and parse the image header which should be relatively simple.
Or you can build a cn1lib on top of native code e.g. see this library, It does that for video which is arguably harder.
I'm testing and looking forward into some solutions like react-pdf and others. But what I really need is to use css properties like transform, translate and more like scale and rotate for example.
Do You heard about som kinda solutions, maybe someone just used something like?
I'll be grateful for any advice.
For all future searcher:
I tried react-pdf and html-pdf, but they were not solutions that would suit me completely.
There was always a lack of either transition, transform or svg support. In addition, they required writing an additional pdf template from which to generate.
So, ultimately, I used a node library called Puppeteer, based on chromium, thanks to which you can generate a pdf just like in the preview on the chrome browser, and regardless of which browser we use.
Puppeter is in fact a Headless Chrome ('running Chrome without chrome') solution, which enters the address we want and performs actions without the participation of the user, in this case writing to a pdf file.
Link: [https://pptr.dev/]
Link: Headless Chrome
Are there any open source angularjs image unloader plug-ins that supports preview and sorting? If not, what approach would be the easiest to implement one?
I used php gd library for this purpose before. In my case, I used php to do image thumbnail and sorting. The job angular need to do is call APIs for upload image, list image with datetime/name/size sort etc.
Hope this helps you a bit.
I used this lib, https://cdnjs.cloudflare.com/ajax/libs/angular-ui-sortable/0.15.0/sortable.min.js with standard file upload, with some effort, it worked.
I am trying to use lightbox to display my video and instead of the video showing I am just getting a loading icon that never stops. I can put an image in place of the video and it works fine. Here is my code:
<img src="images/video_icon.png" height="240px" width="240px" id="middle_circle" class="circle">
As I said, using an image in the href instead of a video works fine so the CSS and JS is linked properly. Also, the video itself loads fine without the lightbox so it's not the video's fault either.
I wasn't able to find any examples for video so I am not sure if there is something different I need to do and was unable to find the solution elsewhere, including on here.
Currently Lightbox2 doesn't support videos by default at all, and it seems the maintainer doesn't plan on adding video support either. You can always edit Lightbox2 to allow video support provided you have the Javascript/JQuery experience.
If you're using Drupal CMS, they have a custom version of Lightbox2 that supports video content. https://www.drupal.org/node/252276
Your best bet is probably finding another Lightbox that can support your needs.
As answered above it don't supported playing Video.
But you can use some like - http://dimsemenov.com/plugins/magnific-popup/ - very nice & customizable ligtbox.