コンピュータ WebブラウザでJavaScriptを使いクリップボード経由で画像を貼り付けることは出来ますか？
画像を Ctrl+V で貼り付けてください。※このページは実際動作します。画像はサーバーにアップロードはされません。ソースコード・HTML<div id="drop" contenteditable="true">画像を Ctrl+V で貼...
javascript
コンピュータ 
コンピュータ JavaScriptで作る！間違い探しのチートツール「ブラウザで画像の違いを検出」
2枚の画像を比較し差分を表示するWebツールです。画像はサーバーにアップロードされません。Webブラウザ内でJavaScriptで画像を比較しています。画像ファイルをドロップしてください画像ファイルをドロップしてください差分を表示・ソースコ...
コンピュータ OpenCV.jpを試す。「ブラウザでOpenCVを使い画像処理」
OpenCV.jsは、画像処理・コンピュータビジョンライブラリとして広く使われているOpenCVを、Webブラウザ上で動作させるためのJavaScriptバインディングです。ライセンスOpenCV.jsのライセンスは、Apache Lice...
コンピュータ JavaScriptで作る「文字置き換えフォーム」
文字置き換えフォーム 入力テキスト: 置換前: 置換後: 置換する クリア 出力: ソースコード<!DOCTYPE html><html lang="ja"><head> <meta charset="UTF-8"> <meta name=...
コンピュータ JavaScriptでワイヤーフレームによる3D球体回転アニメーション
ソースコード抜粋<canvas id="canvas" width="600" height="600"></canvas><script>const canvas = document.getElementById('canvas');c...
コンピュータ JavaScriptでclassの使い方。「数値型のValue Objet」
Value Objectは値に意味をもたせることが目的ですので、プリミティブな数値型に適用すると目的と少しずれますが、JavaScriptの型は寛容なので、制約の厳しいValue Objectを使うことで、良い感じに安全な型になると考えます...
コンピュータ JavaScript非同期テキスト取得 – 外部テキスト読み込みサンプル
テキストを読み込む ここにテキストが表示されます。 <script> document.getElementById("loadBtn").addEventListener("click", function () { fetch("sam...
コンピュータ JavaScriptで一定の間隔で角度の違う線を引く
昔どこかで見た線を引くサンプルプログラムをJavaScriptで再現してみます。こんな感じだったような気もしますが、中心部分の空白が無かったような気もします。ソースコード<!DOCTYPE html><html lang="ja"> <he...
コンピュータ ブラウザで動くJavaScript：DOM操作と開発環境構築
JavaScriptはたまにしか使わないので、コードを書くたびに基本から勉強しなおすことになりがちです。JavaScriptを学習したことを忘れてしまった未来の自分のために、記事として残しておきたいと思います。扱う内容として昔ながらのウェブ...
コンピュータ JavaScriptでHTMLの要素を挿入する
ソースコード:window.addEventListener('load', function () { let entory_form = document.getElementById('entory_form'); let p_1 =...
コンピュータ Windows11でscopeからnode.jsをインストールした話
パッケージ管理システムscoopを使ってnode.jsをインストールした記録です。名前で検索したところ複数ヒットPS F:\git\memoClone\memo> scoop search nodejsResults from local ...
コンピュータ JavaScriptで画像の差分を表示するプログラム
canvasの画像をピクセル単位でアクセスする方法を学びましたので、２つの画像の差分を表示するプログラムを作成してみました。以下のフォームは実際動作します。比較したい画像をドロップし「差分」ボタンを押すと結果の画像が表示されます。結果画像は...
コンピュータ JavaScriptでcanvasの画像をピクセル単位でアクセス。「青色で塗りつぶす」
canvas内の画像の全てのピクセルを青色にセットしてみます。実行例ソースコード<!DOCTYPE html><html lang="ja"> <head> <meta name="viewport" content="width=devi...
コンピュータ JavaScriptでaddEventListenerを初めて使ったこと。
jQueryを使わない素のJavaScriptでイベントを登録する方法で.addEventListener()を使ってみました。形式としてオブジェクト.addEventListener('イベント',function(e){});でオブジェ...