Dynamically Saving Images to a PDF template - javascript

I'm building a website where people can pick several pictures from a range.
I then want the users to be able to create a PDF using those pictures. However I want those pictures inserted in predefined positions and sizes in a template I have already created which will contain other predone materials (words pictures etc).
So my question :
its possible ?
Can anyone recommend a library which will satisfy my needs, I have had a look and I cant see any PDF libraries that seem to mention templates
Any guidance on where to start will be greatly appreciated.

Yes, this is completely possible.
I would recommend using wkhtmltopdf to generate the pdfs from an html template.
Another handy library for this kind of work is image.intervention
Both of these would work with PHP.
If you're working in javaScript you may want to use PDFKit

Edited: Only if you use php.
There are several libraries you can use to generate a pdf depending on what template you will build your pdf. I hardly recommend TCPDF. You can use html to layout the design you want or you can embed the image directly on a page. See an example here.

Related

Schema JSON codes and their effect on the page speed rank

I searched in many articles but nobody has talked about this stuff.
For example, google suggested JSON-LD for structured data but I wanna know if I add dozens line of JSON codes, does not it affect on my page speed badly?
I mean tools like GTMetrix pay attention to inline JS codes and say:
it is better to minify and load inline codes from a file instead of using them inline.
LD-JSON sits separately to the HTML content on the page, so it’s easy to write and troubleshoot and should not be a problem with performance. You can allways use Google Tag Manager to generate JSON-LD and compare data.

PHP generate PDF and edit

I would like to ask
Is it possible to edit the PDF file? For example, insert a new pages between pages , like add page between page 17 and 19.
Which library can i use?
one way to do this is to use ghostscript to split the pdf into individual page images and then you can add additional pages and rearrange pages as needed with tcpdf or similar pdf library.
You can generate pdf easily using FPDF library http://www.fpdf.org/. But you can not edit them via this library. You can use FPDI library mentioned here: PDF Editing in PHP?.
Here is my view:
It is easy to edit Hypertext rather than PDF it self. I use TCPDF to convert HTML to PDF.
Take a look at this. It might be helpful : TCPDF_import is not bringing in an existing file
Thanks, Let us know if you find a better solution.

Dynamic Graphs to Pdf

I have some graphs on html which takes data from database using php function and javascripts. How can i create daily pdf with graphs on it of current date data without opening webpage and clicking on button?
The key problem is that HTML (graphics or even just text) does not translate directly into PDF. There are some libraries that will do this to a limited degree, but typically without the level of control that most people want in a PDF.
There are two very different ways to go about this, and I have used both at various times:
1 - Create a batch-mode PHP program (or other server-side language of your choice) that creates the graphics entirely server-side (many libraries available for that).
2 - Capture the page as if you were running a browser. I have used PhantomJS http://phantomjs.org/ to do that. The big advantage is that you can make use of all your existing graphics code - even libraries such as d3.
Either way, you will need to take the output and insert into a PDF together with headers, footers, explanatory text, etc. I usually use R&OS http://pdf-php.sourceforge.net/ for the PDF part, but there are other libraries that will work just as well.
try dompdf, it might help you. Here is the link
https://github.com/dompdf/dompdf

Attach PDF to PDF as attachment (not as a page) via Javascript in HTML (not in Acrobat)

I would like to generate a PDF portfolio using JS from an HTML/CSS page on a local machine. I would use a PDF template file which includes a PDF portfolio Navigator in SWF form. I have successfully accomplished this using C# and a command line program, but can not identify the proper Javascipt components to do this browser-side or pseuo-server with Node.js. Basically, I am looking for something which will allow me to append a PDF to a new or existing PDF via configuration choices and an 'assemble' action using a JS or HTML button. iTextSharp provides the required PDF interaction functionality, but I can not figure out to run this inside an HTML to allow configuration via the HTML/CSS DOM (i.e. checkboxes, text field desciptors, etc...). Does a library with this type of functionality exist?
So you want to create a PDF using JavaScript?
On a quick google search, I found what appears to be a javascript library for creating and manipulating PDFs call jsPDF
If you want information on how to upload files with JavaScript alone, here is an article on how to do that. It also shows you how to use the file element.
For style, I recommend using a CSS Framework is you don't know much about CSS. I personally use Twitter Bootstrap for quickly prototyping things. It's quick and easy, and has good documentation. You can also use this to see how to make a form in HTML. I haven't got any good starter tutorials for HTML off the top of my list, sorry.
If you don't know much about JavaScript, when it comes to getting the options from the form, so that you can use them as configuration options, I'd suggest using the jQuery framework. It'll help you get up and running quickly enough
Note, all of this shouldn't replace basic training in JavaScript and HTML/CSS. Frameworks make things simpler, but if you don't know how to do something without a framework, you're going to have a hard time with a lot of the more complicated things. This goes for every language

Accessing Local Files with jQuery

I believe that this question has been asked in a few different forms, but I've read quite a few different responses.
At first, I had a web-application written with mostly jQuery that would make use of servlets to retrieve information from various locations JavaScript could not access (ie. Feeds, images from a server, etc.). Now, however, I've been told to do away with the servlets and application configuration classes so that this project of mine contains only HTML, CSS, and JavaScript/jQuery. Rather than pulling the images off of the server, I need to retrieve them from a local file on the computer. I know that allowing this might seem like terrible design, but it's what I've been asked to do. At any rate, what I really need to do is count the number of image files in a directory and then perhaps compile an array of the filenames themselves. I could do this fine in Java when using the servlets, but without them, I'm not sure how or even if this can be done.
I'm basically trying to use the jQuery Cycle plug-in to cycle through these images like a slideshow. I inject (or $("#div").append()) these images into the div by using a loop based on the number of images present.
So, is there a way I can do this with using JavaScript, HTML, jQuery plug-in, etc? I'd like to avoid using PHP and Java at this point...
You can't just read a directory with JavaScript; however, there appears to be a way to "exploit" how browsers function using http://www.irt.org/articles/js014/. It may not be pretty, but the demo works in the latest Chrome and IE7-9 for me. I'm sure some of the techniques could be updated to use cleaner code if you'd like to improve upon it.
EDIT:
Another technique you could use can be found in Javascript read files in folder
It definitely looks to be a cleaner solution. What I'd recommend is extracting the body contents to inject into a hidden div or using the path for an iframe that you can read from.

Categories

Resources