获得摄像的第一帧

2019-10-08 04:08 来源:未知

My code:

<video :src="videoSrc" @loadeddata="loadeddata" style="display:none;">
      fuck video 第一帧
    </video>

<input
          type="file"
          id="chooseMovie"
          accept="video/*"
          class="inputfile"
          @change="handleMovieChange"
        >
        <label for="chooseMovie">
          <div class="default-vcr" v-show="!movieArr.length"></div>
        </label>

    handleMovieChange (e) {
      let files = e.target.files || e.dataTransfer.files
      if (files.length) this.setMovieSourceImg(files[0])
      let fmData = new FormData()
      fmData.append('file', files[0])
      fmData.append('path_name', 'healthRecords/video')
      uploadFiles(fmData).then((res) => {
        if (res.code === 200) {
          this.bigFormData.append(`video_list[${this.videoIndex}][tar_url]`, res.data.url)
        } else {
          myToast('视频上传失败')
        }
      })
    },
    setMovieSourceImg (file) {
      let that = this
      let fr = new FileReader()
      fr.onload = function (e) {
        that.videoSrc = fr.result
      }
      fr.readAsDataURL(file)
    },

    dataURItoBlob (dataURI) {
      var byteString = atob(dataURI.split(',')[1])
      var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]
      var ab = new ArrayBuffer(byteString.length)
      var ia = new Uint8Array(ab)
      for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i)
      }
      return new Blob([ab], {type: mimeString})
    },
    loadeddata (e) {
      let scale = 0.8
      let video = e.path[0]
      var canvas = document.createElement('canvas')// canvas画布
      canvas.width = video.videoWidth * scale
      canvas.height = video.videoHeight * scale
      canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height)// 画图
      // video.setAttribute('poster', canvas.toDataURL('image/png', 1))// 关键一步 —— 设置标签的 poster 属性的值为 base64 编译过后的canvas绘图。
      let img = canvas.toDataURL('image/png', 1)
      this.movieArr.push(img)

      let fmData = new FormData()
      fmData.append('file', this.dataURItoBlob(img), 'base64.jpeg')
      fmData.append('path_name', 'tmp')
      uploadImages(fmData).then((res) => {
        if (res.code === 200) {
          this.bigFormData.append(`video_list[${this.videoIndex}][cover_url]`, res.data.url)
          this.videoIndex = this.videoIndex + 1
        } else {
          myToast('封面图上传失败')
        }
      })
    },
public class Solution { private int row = 0; private int col = 0; public int longestIncreasingPath(int[][] matrix) { if (matrix == null || matrix.length == 0 || matrix[0].length == 0) { return 0; } row = matrix.length; col = matrix[0].length; int max = 1; int[][] cache = new int[row][col]; for (int i = 0; i < row; i++) { for (int j = 0; j < col; j++) { if (cache[i][j] != 0) { max = Math.max(max, cache[i][j]); continue; } else { cache[i][j] = helper(matrix, cache, i, j); max = Math.max(max, cache[i][j]); } } } return max; } private int helper(int[][] matrix, int[][] cache, int i, int j) { if (cache[i][j] != 0) { return cache[i][j]; } else { int sum = 0; if (inBound && matrix[i][j] < matrix[i + 1][j]) { sum = Math.max(sum, helper(matrix, cache, i + 1, j)); } if (inBound && matrix[i][j] < matrix[i - 1][j]) { sum = Math.max(sum, helper(matrix, cache, i - 1, j)); } if (inBound && matrix[i][j] < matrix[i][j + 1]) { sum = Math.max(sum, helper(matrix, cache, i, j + 1)); } if (inBound && matrix[i][j] < matrix[i][j - 1]) { sum = Math.max(sum, helper(matrix, cache, i, j - 1)); } sum += 1; cache[i][j] = sum; return sum; } } private boolean inBound(int i, int j) { if (i >= 0 && i < row && j >= 0 && j < col) { return true; } else { return false; } }}

那道难点并不是很难。dfs + cache 就足以缓和。速度有一点慢。看了答案。开掘实现形式跟自家非常多。他跑15ms, 笔者跑 39ms. 也基本上。估摸完毕细节上差了点。

那是赢得录制第一帧的几段基本代码,思路

reference:

  • 取得本地录制的base64文件,然后赋值给video标签
  • video标签设置为display:none;
  • loadeddata 大旨措施,监听摄像第一帧加载成功
  • 跑上边包车型大巴canvas代码,然后就能够生成一张图片,完美

Anyway, Good luck, Richardo! -- 08/28/2016

很缺憾的是这段代码费经心血的代码曾经在自己的门类中用不到了,记得一年前大约这年,自个儿也想完毕那一个成效,不过完全部是懵的,以后最少能兑现了,很欢悦,看见了团结的迈入。

慢慢的觉察canvas能落实无数职能,何况相当多职能类似只好采取canvas来贯彻,svg和canvas大致,可是后面一个难的非常多,前年这个东西都要好好钻探下。

删掉自身劳顿写的代码,有一些难熬啊

TAG标签:
版权声明:本文由990888藏宝阁发布于编程算法,转载请注明出处:获得摄像的第一帧