HOME 教育状況公表 令和2年9月30日
⇒#2526@研究ノート;

ウェブブラウザー上で,マウスクリックのイベントを取得する方法

日時
関係者(共同研究者)

https://edu.yz.yamagata-u.ac.jp/Public/52210/52210_13_camera.html

https://edu.yz.y…

イベントの定義

canvasにclickイベント起きたときにonClick 関数呼び出す

canvas.addEventListener('click', onClick, false);

onClick関数の定義

function onClick(e) {

/*

* rectでcanvasの絶対座標位置取得し

* クリ座標であるe.clientX,e.clientYからその分引く

* クリ座標はdocumentからの位置返すため

* ※rectはスクロール量によって値が変わるのでonClick()内でつど定義

*/

var x = 0;

var y = 0;

var rect = e.target.getBoundingClientRect();

x = e.clientX - rect.left;

y = e.clientY - rect.top;

/*rect.topが413.875小数点持つことはなぜか不明*/

alert(x + "," + y)

}

取り急ぎ報告まで


QRコード
https://edu.yz.yamagata-u.ac.jp/developer/Asp/Youzan/Laboratory/LaboNote/@LaboNote.asp?id=2526

SSLの仕組み

このマークはこのページで 著作権が明示されない部分について付けられたものです。

山形大学 データベースアメニティ研究所
〒992-8510 山形県米沢市城南4丁目3-16
3号館(物質化学工学科棟) 3-3301
仁科・立花・伊藤研究室 准教授 伊藤智博
0238-26-3573
http://amenity.yz.yamagata-u.ac.jp/

Copyright ©1996- 2020 Databese Amenity Laboratory of Virtual Research Institute,  Yamagata University All Rights Reserved.