html5 canvas 이미지&글자

HTML:

JS :

var $container = $("#wrapper");
var canvas = $container.find('canvas')[0];
var context = canvas.getContext('2d');
var currentX = canvas.width / 2;
var currentY = canvas.height / 1.9;

var currentText1 = '';
var currentImage = '';
$container.on('keyup', '.input-text1', changedText1);


//src : 이미지 파일명
function renderImage(src){
	context.clearRect(0,0, canvas.width, canvas.height);
	var image = new Image();
	image.onload = function(){
		currentImage = this;
		context.drawImage(this, 0, 0, 398, 323, 0, 0, 398, 323);
		renderText();
	};
	image.src= '/m/images/event/cover/'+src;
}

function renderText(){
	context.clearRect(0,0, canvas.width, canvas.height);
	if(typeof(currentImage) != 'string'){
		context.drawImage(currentImage, 0, 0, currentImage.width, currentImage.height, 0, 0, canvas.width, canvas.height);
	}
	context.fillStyle = currentColor;
	context.font = currentSize+"px 돋움";
	wrapText(context, currentText1, currentX, currentY);
}

function wrapText(context, text1, x, y) {
	var cars1 = text1.split("\n");

	context.textAlign="center"; 
	context.font = "bold 22px '나눔고딕'";
	context.fillText(text1, x, y);
}



//저장 호출
function saveImgApp(){
	var getCData = canvas.toDataURL("image/png");
	saveImageData(getCData.replace(/^data:image\/(png|jpg);base64,/, ""), "경로_빼도됨");
}

//최종저장 함수
function saveImageData(image_data, image_path) {
	$.post("/saveImage.asp", {imageData:image_data, imagePath:image_path, submit:true})
	.done(function(data, textStatus, jqXHR) {
		//alert("저장성공");
		globalFinalImgName = data;
	}).fail(function(jqXHR, textStatus, errorThrown) {
		alert(textStatus);
		console.log(jqXHR);
	});
}

ASP :

<%
'-----------  코드를 이미지로 바꿔주는 코드 -----------
Function Base64Data2Stream(sData)
    Set Base64Data2Stream = Server.CreateObject("Adodb.Stream")
        Base64Data2Stream.Type = 1 'adTypeBinary
        Base64Data2Stream.Open
    With Server.CreateObject("MSXML2.DomDocument.6.0").createElement("b64")
        .dataType = "bin.base64"
        .text = sData
        Base64Data2Stream.Write .nodeTypedValue 'write bytes of decoded base64 to stream
        Base64Data2Stream.Position = 0
    End With
End Function

Dim CanvasStream
photo_img = Request.Form("imageData")
photo_path = Request.Form("imagePath")

Set CanvasStream = Base64Data2Stream(photo_img)

Randomize
selNo = Int((99999 * Rnd) + 1)

sDate2 = Right("0" & Day(Now),2) & Right("0" & Hour(Now),2) & Right("0" & Minute(Now),2) & Right("0" & Second(Now),2) & "_" & selNo
fileB = sDate2 & ".png"

Path1 = Server.Mappath(photo_path)
filepath = Path1 & "\" & fileB

CanvasStream.SaveToFile filepath, 2 'adSaveCreateOverWrite

Response.write fileB
REsponse.End
%>