サンプル 簡易カメラ - ソースコード

説明

　「crocro.jscam」は、クロノス・クラウンの柳井政和が開発しているJavaScirptのライブラリです。「crocro.jscam」を使うと、JavaScriptからWebカメラを扱うことができます。また、簡単な図形認識などを行えます。

　このページでは、この「crocro.jscam」のサンプルである「サンプル 簡易カメラ」のソースコードを掲載します。

ソースコード

以下、ソースコードです。

<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>「crocro.jscam」 - サンプル 簡易カメラ - クロノス・クラウン</title>
    <script
        type="text/javascript"
        src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"
    ></script>
    <script type="text/javascript" src="jscam.js"></script>
    <script language="javascript">
        // 変数
        var cap;

        // 起動時処理
        $(document).ready(function() {
            // JSカメラ初期化
            crocro.jscam.initSwfCam();
            cap = crocro.jscam.makeCaptureObject("cnvsCap");

            // コールバックの設定
            cap.setBackDataType(["pixelRaw"]);
        });

        // 画像出力
        function outputImg() {
            cap.capture(function() {
                var dId = "img" + new Date().getTime();
                $("#output").append($("<img>").attr("id", dId));
                cap.outputImage(dId, "");
            });
        }

        // 画像削除
        function delImg() {
            $("#output").empty();
        }
    </script>
</head>
<body bgcolor="#ffffff">

    <div class="boxOut">
        <div style="float: left;">
            <script language="javascript">
                crocro.jscam.write();
            </script>
        </div>
        <div style="float: left; margin-left: 2em;">
            <canvas id="cnvsCap" width="320" height="240"></canvas>
        </div>
        <div style="clear: both;"></div>
        <input type="button" onClick="outputImg()" value="撮影">
        <input type="button" onClick="delImg()" value="画像削除">
        <br>
        <div id="output"></div>
    </div>

</body>
</html>
Cronus Crown（クロノス・クラウン）のトップページに戻る
(c)2002-2024 Cronus Crown　(c)1997-2024 Masakazu Yanai
ご意見・お問い合わせはサイト情報 弊社への連絡までお願いします
個人情報の取り扱い、利用者情報の外部送信について