自宅IT
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 OCRとは tesseract-ocr / pyocrとは インストール 使い方と実装 pyocr.builders tesseract_layout (pagesegmode) 実装 結果 前回は、バーコード画像から商品情報を取得するところ…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 取得方法のアイディア 1.スクレイピングする方法 BeautifulSoup4 をインストール 実装 結果 2.WebAPIで検索する方法（種類） Product Advertising API (Amazon Web Services) 楽…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 バーコードとは 環境 zbarインストール インストール時のトラブルシューティング 「error: command 'arm-linux-gnueabihf-gcc' failed with exit status 1」がインストール時に出…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 そもそもの問題 非同期にする方法 実装 前回までで、javascript/CSSを用いて撮影画面を作成した。 最後にUIの完成度を高めたいので撮影ボタンを押したらバックグラウンド全体が青…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 前回は、ボタンの透過度を設定した。 今回は、基礎的な話でなんとなく使っていたCSSの接頭句の違いを書く。 前々回のコードをコピーしたのが下記。"."で開始するstyleは、classに…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 完成イメージ 実装 結果 前回は、レイアウトの重ね合わせを実装した。 今回は、ボタンの透過度を設定したい。 完成イメージ 前回からの続きだが、ボタンが透過して下レイヤーの映…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 完成イメージ 基本方針 div要素で重ねわせ方法と実装 ポイント 実装 結果 前回は、カメラ撮影枠を作成するために、カメラリソースの切り替えによるVideo要素のサイズ変化を検出し…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 具体例：Video要素のプレビューの中央に撮影領域を作りたい 実装：Video要素のサイズ変化を検出、確定時のサイズを取得 前回は、UserMediaのカメラリソースを切り替えるなどの話…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp 目次 参考資料 MediaDeviceInfoの解説とUserMediaの使い方手順 前回からWebカメラ周り(Video要素やwebRTC, UserMedia)の操作を進めていたが、カメラリソース周りを今回進める。 やり…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 Videoの回転 Canvasの回転 参考資料 前回までの投稿でバックエンドとフロントエンドの通信周りは整理した。 ここからはWebカメラの操作を進める。今回は、video/canvasを上下180…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 送信側実装 (python:flask) 受信側実装 (javascript) 前回までで、javascript->flaskへbase64を送信した。 これを画像処理して、その結果を返信するときjsonだと汎用性も高い。 …
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 対策 参考資料 前回は、base64でバックエンドに画像を送信したが、次のエラーが表示れている。 XMLHttpRequest cannot load https://192.168.0.100:12345/hoge_image_processing.…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 base64とは 送信側実装(Javascript) 受信側実装(python : flask) 参考資料 前々回、ChromeでWebカメラを起動/撮影した後、Canvasに書き出すところまで進めた。 前回は、Ajaxを利…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 送信側実装(Javascript) 受信側実装(python : flask) 対応関係 前回まででWebカメラで撮影した画像をCanvas領域にコピーするところまで終えた。 が、根本的にJavascript - python…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 標準入力をバックグラウンドで無視すると落ちる バックグラウンド実行対策 参考資料 標準入力をバックグラウンドで無視すると落ちる 前回 flaskをhttps化 (http over ssl)したが…
本件の実装の一部 motojapan.hateblo.jp前回の続き motojapan.hateblo.jp目次 SSL対応の手順 秘密鍵を作成 秘密鍵から公開鍵を作成 デジタル証明書を作成 flask上でHTTPSサーバー起動 おまけ JavascriptからWebカメラを起動しようとしたら下記コードで怒られ…
本件の実装の一部 motojapan.hateblo.jp カメラ起動 参考にした記事① 参考にした記事② カメラ撮影 Webアプリ上でHTML+JSでWebカメラを動作させたい。 私の場合、それほど特殊なWebカメラの使い方をするわけでもないし、こういった類の記事は山のようにあるの…
下記記事の続きです。 motojapan.hateblo.jp 構想 Google Spreadsheetを探して、食品名と賞味期限を手入力するのは、実は結構めんどくさい。 なので、Webアプリ開発と画像認識の勉強も兼ねて、下のような構成を構想。 写真を撮影すると商品情報が取得でき、…
久しぶりにsambaを入れたらうまく動かないとか、ubuntu16.04ではsambaサーバーが動いていたのに、raspberry pi 3ではうまくいかないときのためのチェック項目 基本手順 インストール 設定変更 sambaを再起動 【チェック1】sambaが起動しているか確認する 【…
GAS(Google Apps Script)という、Google製サービス上で動くJavascript互換のスクリプトを初めて触ってみた。家の課題を解決するために。 課題：家の調味料や保存食の賞味期限がいつの間に切れていく やったこと 0.夫婦共有のスプレットシートを作る 1.スプレ…
