This way of saving helped to get the original image quality.
file_put_contents($upload_path.'images\\user\\profile\1\\'.$fileName, base64_decode($profilePicture));
Question
I am able to create the image but the png it generates has a dark background. actually it should be transparent but i have no idea why its becoming black color in background. what am i doing wrong ?
$img = imagecreatefromstring(base64_decode($profilePicture));
if ($img != false) {
header('Content-Type: image/png');
$rnd = sprintf('%04d', rand(0, 9999));
$fileName = $rnd.'_'.time().'.png'; // random number + timestamp
if (!imagepng($img, $upload_path.'images\\user\\profile\1\\'.$fileName))
$this->sendResponse(false, 1133);
This is how it should be, http://www.image-share.com/upload/2510/41.png
But this is the image i am receiving... http://www.image-share.com/upload/2510/42.png
Solution 2
This way of saving helped to get the original image quality.
file_put_contents($upload_path.'images\\user\\profile\1\\'.$fileName, base64_decode($profilePicture));
OTHER TIPS
Basically the image should have its background marked as transparent, nothing to do with the code
in controller file
public function actionCreate()
{
$model = new Datamykad();
if ($model->load(Yii::$app->request->post()) && $model->save()) {
$folder = Yii::getAlias('@app').'\images';
$filename = date("Y-m-d_H-i-s").'.png';
$file_path = $folder.'\.'.$filename;
$rawImage = $model->stringtoimage;
$removeHeaders = explode(',', $rawImage);
//need to decode before saving (data base64)
$decode= base64_decode($removeHeaders[1]);
file_put_contents($file_path, $decode);
//}
$model->img =$filename;
$model->save();
return $this->redirect(['view', 'id' => $model->id]);
} else {
return $this->render('create', [
'model' => $model,
]);
}
}
view file.
at javascript;
function saveIt(){
//var canvasData = new Image();
var myDrawing = document.getElementById("canvas");
var canvasData = myDrawing.toDataURL("image/png");
//var postData = "canvasData="+canvasData;
var postData = canvasData;
imgLog(postData);
}
function imgLog(data){
document.getElementById("datamykad-stringtoimage").textContent += data;
}