未分類 デスクトップからドラッグ&ドロップ
デスクトップからドラッグ&ドロップウィンドウのdropイベントとdragoverイベントのみ、イベントハンドラを設定しブラウザーでのデフォルトアクションが動作しないようにするevt.preventDefault();のとこが該当次に、デスク...
未分類
未分類 未分類 世界測地系と、日本測地系
世界測地系と日本測地系日本周辺の位置情報に特化した独自の位置情報の計算が日本測地系といわれるGoogleMapで使われているのは世界共通の位置情報の計算方法で世界測地系といわれる現在、ほとんどのアプリは、世界測地系なぜなら日本測地系と、世界...
未分類 ドロップ領域のイベント処理
ドロップ領域のイベント処理ドラッグ項目がドロップ領域に入るとdragenterイベントが発生このイベントが発生したら、ドロップ領域の背景を変更drop.addEventListener("dragenter",fuction(evt){ev...
未分類 ドラッグ処理のメモ
まずdocument.querySelectorAll()で、ドラッグするdiv要素をピックアップするちなみに、#dragitems divはid="dragitems" の中のdiv要素という意味これを変数 itemListへいれればドラ...
未分類 HTML5のドラッグ&ドロップ
HTML5のドロップ&ドラッグはデスクトップからのファイルもドロップできるまた、File APIと組み合わせてデスクトップからドロップしたファイルの内容を読み込んで処理できるたとえばデスクトップの画像をCanvasへドラッグ&ドロップしCa...
未分類 Canvasまとめ
Canvas関連まとめCanvasは2Dも3Dも描画できるただし、2D描画は2Dコンテキストを取得しないとダメ塗り関連はfillStyle線関連はstrokeStyleで設定する座標点の移動はmoveTo()でする直線を描くにはlineTo...
未分類 変数へのピクセルデータ保存
変数へピクセルデータ保存Canvasのピクセルデータを読み出すにはgetImageData()を使うgetImageData()は、読み出したいピクセルの範囲をパラメータで指定するgetImageData()の書式はgetImageData...
未分類 ローカルストレージと取り消し機能
ローカルストレージと取り消し機能取り消し機能には過去に遡り取り消しできるタイプ一度だけの取り消し機能タイプがあるブラウザーで何回も取り消し可能にするとその分メモリを消費するこのため、多くのアプリでは取り消し可能に制限かついているちなみに、今...
未分類 SVGについて
SVGSVGはscalablevectorgraphicsの略SVGはHTML5の関連技術なのでHTML5の仕様には含まれないcanvasでもSVGでもイラストや図形が描けるcanvasとSVGの違いを紹介まず、canvasこちらはピクセル...
未分類 canvasへの文字の描画
文字の描画文字の描画はマウスボタンがクリックされたときのイベントを捕捉してから行うあと、文字を描画するときには一旦canvas全体を黒く塗りつぶしてから行うこれはすでにある文字の上に重なって表示されるとわかりにくいからこの処理のソースはco...