data-url | 易学教程

Streaming PDF into iframe using dataurl - works only in Chrome

阅读更多关于 Streaming PDF into iframe using dataurl - works only in Chrome

问题 The following works in Chrome, but the iframe content is blank in Firefox 15 and IE 9. <html> <head></head> <body> <p>this n that</p> <iframe type="application/pdf" width="95%" height="95%" src="data:application/pdf;base64,<?php echo base64_encode(file_get_contents('memlist.pdf'));?>"> Oops, you have no support for iframes. </iframe> <p>this n that</p> </body> </html> The problem seems to be the dataurl. If I change it to simply src="memlist.pdf" then it works everywhere. The PDF size is 75kb

Images in one file under IE6 WITHOUT php

阅读更多关于 Images in one file under IE6 WITHOUT php

问题 I need to create a page with all images and CSS in it, so it would be only one file. I know that there is something like MHT (IE web archive), BUT there is problem. It works only in IE and Opera, not in FF. And i need my page to be working in all IEs (6+), Opera and FF. I know there is a way to encode my images in base64 and I also know, that IE 6 and 7 does not support data URLs. I've seen Dean Edward's trick for IE 6 and 7 but it works only with PHP support. And I can't use PHP, so this isn

How to create a base64 file from nothing?

阅读更多关于 How to create a base64 file from nothing?

问题 I want to be able to create base64 files (images, sounds, video) without any previous models. For example, if I want to create a base64 64px*64px red image, how can I do this without creating first a canvas? I would also like to create a sound (note) with no model. I've searched on Google for some documentation on base64 encoding but I did not seem to find specific things for my need. I am going to use Javascript, but I guess this should be the same for every language. 回答1: Try function

JS - How to turn Image object into grayscale and display it

阅读更多关于 JS - How to turn Image object into grayscale and display it

问题 Basically, when a button is clicked, it'll tell the mobile device to go to the camera. Once the camera takes a picture, it'll give me the image data (is it called the data URL?). This is my code to handle it: var imagesrc = "data:image/jpeg;base64," + imageData; var myimage = new Image(500, 500); myimage.src = imagesrc; <---- to populate the object with the colored image myimage.src = grayscale(myimage); <---- here I set it to the grayscale image I want to call a method called grayscale() and

html5 canvas toDataURL returns blank image

阅读更多关于 html5 canvas toDataURL returns blank image

问题 Beginning with a blank canvas: <canvas id='myCanvas' width='800' height='600'></canvas> Then initializing that canvas: function init_canvas(){ var canvas = document.getElementById('myCanvas'); context = canvas.getContext('2d'); context.lineCap = 'round'; // fill it with white background context.save(); context.fillStyle = '#fff'; context.fillRect(0, 0, context.canvas.width, context.canvas.height); context.restore(); return; } Then do a bunch of drawing on the canvas. Then try to save it to

Renaming an image created from an HTML5 canvas

阅读更多关于 Renaming an image created from an HTML5 canvas

问题 I have made a simple canvas and save it as an image. I have done this with the help of this code: var canvas = document.getElementById("mycanvas"); var img = canvas.toDataURL("image/png"); and pop up the created image with this: document.write('<img src="'+img+'"/>'); But its name is always a weird one. I want to rename the image name like faizan.jpg etc. How can I do this? 回答1: To put it simply, you can't. When you call the toDataURL method on an HTMLCanvasElement it generates a string

Generate data URL from image

阅读更多关于 Generate data URL from image

问题 The simple problem I have a thumbnail from the Google Drive API and I need to save a copy because it has a validity expiration. Context I am building a backend for admins to add content to the website and I use Google Drive as resource management tool. I am running it on Meteor, so it's Nodejs on server-side. Attempts Use the well-known canvas method to retrieve the data url getImageDataURL = function (URL, cb) { var img = document.createElement("img"); var canvas = document.createElement(

dataurl to image for download in php

阅读更多关于 dataurl to image for download in php

问题 I'm creating image using canvas and using following script, function getImage() { var canvas1 = document.getElementById("images"); if (canvas1.getContext) { var ctx = canvas1.getContext("2d"); var myImage = canvas1.toDataURL("image/jpg"); } $('<form action="download.php" method="POST">' + '<input type="hidden" name="aid" value="' + myImage + '">' + '</form>').submit(); } And in my Download.php file is, <?php $img = $_POST['aid']; echo "<img src=".$img.">"; ?> it showing image correctly. But i

how to create an image file on server from dataurl

阅读更多关于 how to create an image file on server from dataurl

问题 I have an image in a dataurl format, like: data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgMCAgMDAwMEAwME…iiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigD/2Q== I need to convert this string in JavaScript to another string which can be directly copied to a blank jpg file so that it can be viewed by the user. Any idea how to achieve this? 回答1: You just need to remove "data:image/jpeg;base64," from DataURI. $dataUri = "data:image/jpeg;base64,/9j

canvas.toDataURL() not working properly [duplicate]

阅读更多关于 canvas.toDataURL() not working properly [duplicate]

This question already has answers here : How to return value from an asynchronous callback function? [duplicate] (3 answers) Closed 10 months ago . I am having a canvas in which I upload an image with the following code: function handleImage(e){ var reader = new FileReader(); reader.onload = function(event){ var img = new Image(); img.onload = function(){ canvas.width = img.width; canvas.height = img.height; ctx.drawImage(img,0,0); } img.src = event.target.result; } reader.readAsDataURL(e.target.files[0]); } Now I wanted to use the canvas.toDataURL() to load the image to another canvas. The