在相机预览中添加自定义字符串并使用图像上的字符串保存图像

时间:2019-04-23 06:41:00

标签: cordova ionic3 cordova-plugins hybrid-mobile-app ionic-native

我已将ionic-native / camera-preview添加到我的ionic3应用程序中,我已使相机预览正常工作并能够保存图像,但是现在我想在相机预览中添加自定义字符串,例如经度,经度或时间戳,并保存图像带有该字符串

我尝试使用css在相机预览上覆盖字符串,但不会保存带有字符串的图像。

这就是我所拥有的

import { CameraPreview, CameraPreviewPictureOptions, CameraPreviewOptions, CameraPreviewDimensions } from '@ionic-native/camera-preview';

export class HomePage {

constructor(public navCtrl: NavController,private camera: Camera,private cameraPreview: CameraPreview,private platform:Platform) {

    this.platform.ready().then( () => {

        const cameraPreviewOpts: CameraPreviewOptions = {
            x: 0,
            y: 0,
            width: window.screen.width,
            height: window.screen.height,
            camera: 'rear',
            tapPhoto: true,
            previewDrag: true,
            toBack: true,
            alpha: 1
        };

        this.cameraPreview.startCamera(cameraPreviewOpts).then( (res) => {
            console.log(res)
        },
        (err) => {
            console.log(err)
        });
    })

}
base64Image

takePicturePreview(){
    // picture options
    const pictureOpts: CameraPreviewPictureOptions = {
        width: 1280,
        height: 1280,
        quality: 85
    }

    // take a picture
    this.cameraPreview.takePicture(pictureOpts).then((imageData) => {
        console.log(imageData);
    });
}

takePicture(){
    const options: CameraOptions = {
        quality: 100,
        destinationType: this.camera.DestinationType.FILE_URI,
        encodingType: this.camera.EncodingType.JPEG,
        mediaType: this.camera.MediaType.PICTURE
    }



    this.camera.getPicture(options).then((imageData) => {
        // imageData is either a base64 encoded string or a file URI
        // If it's base64 (DATA_URL):
        this.base64Image = imageData;
    }, (err) => {
        // Handle error
        console.log(err);
    });
}

 }

我想在摄像机预览中显示纬度,经度和时间戳,并使用该字符串将图像保存在图像上

0 个答案:

没有答案