amins1369
دوشنبه 26 بهمن 1394, 08:44 صبح
سلام و درود
دوستان خروجی حال از تگ canvas رو می خوام ذخیره کنم در سرور کمک کنید چطوری می شه
کدی که خودم نوشتم
واسه خروجی canvas
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var videoId = 'video';
var scaleFactor = 0.25;
var snapshots = [];
/**
* Captures a image frame from the provided video element.
*
* @param {Video} video HTML5 video element from where the image frame will be captured.
* @param {Number} scaleFactor Factor to scale the canvas element that will be return. This is an optional parameter.
*
* @return {Canvas}
*/
function capture(video, scaleFactor) {
var w = video.videoWidth * scaleFactor;
var h = video.videoHeight * scaleFactor;
var canvas = document.createElement('canvas');
canvas.width = w;
canvas.height = h;
var ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, w, h);
return canvas;
}
/**
* Invokes the <code>capture</code> function and attaches the canvas element to the DOM.
*/
function shoot(){
var video = document.getElementById(videoId);
var output = document.getElementById('output');
var canvas = capture(video, scaleFactor);
canvas.onclick = function(){
window.open(this.toDataURL());
};
snapshots.unshift(canvas);
output.innerHTML = '';
for(var i=0; i<10; i++){
output.appendChild(snapshots[i]);
}
}
window.onload=shoot;
</script>
</head>
<body>
<div style="border: solid 1px #ccc; padding: 10px; text-align: center;">
<video id="video" width="320" style="display: none">
<source src="1%20(2).mp4">
Your browser does not support HTML5 video tag. Please download FireFox 3.5 or higher.
</video>
<br/>
<div id="output" style="display: inline-block; top: 4px; position: relative ;border: dotted 1px #ccc; padding: 2px;"></div>
</div>
</body>
</html>
با تشکر
دوستان خروجی حال از تگ canvas رو می خوام ذخیره کنم در سرور کمک کنید چطوری می شه
کدی که خودم نوشتم
واسه خروجی canvas
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var videoId = 'video';
var scaleFactor = 0.25;
var snapshots = [];
/**
* Captures a image frame from the provided video element.
*
* @param {Video} video HTML5 video element from where the image frame will be captured.
* @param {Number} scaleFactor Factor to scale the canvas element that will be return. This is an optional parameter.
*
* @return {Canvas}
*/
function capture(video, scaleFactor) {
var w = video.videoWidth * scaleFactor;
var h = video.videoHeight * scaleFactor;
var canvas = document.createElement('canvas');
canvas.width = w;
canvas.height = h;
var ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, w, h);
return canvas;
}
/**
* Invokes the <code>capture</code> function and attaches the canvas element to the DOM.
*/
function shoot(){
var video = document.getElementById(videoId);
var output = document.getElementById('output');
var canvas = capture(video, scaleFactor);
canvas.onclick = function(){
window.open(this.toDataURL());
};
snapshots.unshift(canvas);
output.innerHTML = '';
for(var i=0; i<10; i++){
output.appendChild(snapshots[i]);
}
}
window.onload=shoot;
</script>
</head>
<body>
<div style="border: solid 1px #ccc; padding: 10px; text-align: center;">
<video id="video" width="320" style="display: none">
<source src="1%20(2).mp4">
Your browser does not support HTML5 video tag. Please download FireFox 3.5 or higher.
</video>
<br/>
<div id="output" style="display: inline-block; top: 4px; position: relative ;border: dotted 1px #ccc; padding: 2px;"></div>
</div>
</body>
</html>
با تشکر