Java初心者です。
マウスのイベント処理(X,Y座標を得る)と動画(ネットワークカメラの動画)をうまく組み合わせて、その動画の座標値を得る方法を教えてください。とりあえず静止画の座標値を得る方法でも結構です。
Javaに詳しい方、是非ご教授お願い致しますm(__)m

このQ&Aに関連する最新のQ&A

A 回答 (2件)

APIより


-----------------------------------------------------------
コンポーネント上の「関連する」マウスイベント (プレス、リリース、クリック、コンポーネントへの出入り) を受け取るためのリスナーインタフェースです。マウスの移動およびドラッグを追跡するには、MouseMotionListener を使用します。

マウスイベントの処理に関連するクラスは、このインタフェースに含まれているすべてのメソッドを定義してこのインタフェースを実装するか、関連するメソッドだけをオーバーライドして abstract クラス MouseAdapter を拡張します。

そのようなクラスから作成されたリスナーオブジェクトは、コンポーネントの addMouseListener メソッドを使ってコンポーネントに登録されます。マウスイベントは、マウスを押したり、離したり、クリック (押してから離す) したときに生成されます。また、マウスカーソルがコンポーネントに入ったり、コンポーネントから出たりしたときにも、マウスイベントが生成されます。マウスイベントが発生すると、リスナーオブジェクト内の関連するメソッドが呼び出され、そのメソッドに MouseEvent が渡されます。
--------------------------------------------------------------
とあります。
要するに、このMouseListenerを介して、マウスが押されたと言う
イベントを受け取ります。
このインターフェイスには5つのメソッドが用意されているので
それを実装してもよいですし、今回ならmousePressed()だけオーバーライド
してそれをabstract クラス としてもよいです。
まぁ、簡単な話しがMouseListenerをimplements しておけば、
マウスが押された時に、mousePressed()の中の処理が走るわけです。

ちょっと、説明が下手でわかりにくかったら、また質問してください。

この回答への補足

こんにちは!
いつもお世話になってます(^^)

mkimさんのおかげでマウスでブラウザ(IE5.0)上の灰色の部分の座標値を得ることはできました(^o^)
しかし、その灰色の部分に画像を貼り付け、その画像の座標値を得たいのですが、画像をうまく貼り付けることができません。
javaファイルのと同じディレクトリにあるローカルな画像は貼り付けて座標値を得ることができたのですが、インターネット上にある画像を貼り付けることができませんでした。
最終的にはライブカメラの画像を貼り付けようと考えているので、これができないと先に進むことができません。

もしご存知でしたら教えてください(^^)
わかりにくい質問でごめんなさいm(__)m
一応、うまくいかなかったjavaファイルを載せておきます。

//My_Image03.java

importjava.awt.Graphics;
importjava.applet.Applet;
importjava.awt.Image;

publicclassMy_Image03 extends Applet {
Imageim;

public void init() {
im = getImage(getDocumentBase(), "http://www.honda.co.jp/image/b_hmark.gif");
}

public void paint(Graphics g) {
g.drawImage(im, 10, 10, this);
}
}

構文が間違っているのでしょうか?
回答、お待ちしております(^o^)丿

補足日時:2001/06/02 15:09
    • good
    • 0
この回答へのお礼

ご指導ありがとうございました(^^)

他にいろいろ疑問は残りましたが、これからいろいろ頑張ってみようと思います。
また、機会があれば回答宜しくお願い致します。

本当にありがとうございました! では(^o^)/~~~

お礼日時:2001/06/07 11:40

java.awt.event.MouseEvent のクラスを見てみよう。


getPoint()なんて言うメソッドがあるから、それを使うといいかも。。
返り値は、Point型だからjava.awt.Pointも見てみよう。
MouseListenerインターフェイスも見てみようね。

public class hogehoge extends Applet
implements MouseListener {

Point point;
int x;
int y;

public void mousePressed(MouseEvent me) {
point = me.getPoint();
x = point.x;
y = point.y;
}

以下省略

みたいな感じでいけると思うよ。
あとは、色々自分で考えてがんばってください。
ではでは~(^^)

この回答への補足

回答ありがとうございます!
返事送れて申し訳ありませんでした。

「MouseListenerインターフェイス」についてよくわからなかったので、もう少し解説していただけないでしょうか?

宜しくお願い致します(^^)

補足日時:2001/05/20 13:35
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qイラストレーターでのダブル、シングルトンボについて

広告制作の仕事をしています。
トンボにはダブルトンボやシングルトンボと呼ばれるものが
あるのは知っていたのですが
ずっとあまり気にせずトンボはトンボとして
普通にトリムマークで作るトンボを使用していました。

ダブルトンボとシングルトンボはどういうものか。
どういった時に、どういう為に使うものなのか。
また、そのトンボの付け方など教えていただけないでしょうか。
色々サイトで調べても どうもうまく理解できなくて…
どなたかご存知の方がいらっしゃいましたら教えて頂きたいです
宜しくお願い致します!

Aベストアンサー

>いつも使っているトリムマークで付けるトンボが
>ダブルトンボという事になるのでしょうか?

Illustratorで 「日本式トンボ」が ダブルトンボとなります。

>シングルトンボはオフセット輪転機の場合に付けるトンボの種類

 いえいえ、オフセット輪転機で「オフ輪サイズ」という「必ず白フチがつく」サイズがありますが
 その場合にのみ使います。 
 
 オフセット輪転でも白フチがつかない「4方断裁」する場合はダブルトンボを使います。

Q【java】座標の値をテキストファイルに出力

javaを勉強中の者です。
座標の値をクリックした際にテキストファイルに出力したいのですが、どうしてもうまくできません。

調べてはいるのですが、わかりませんでした。
javaに詳しい方がいらっしゃれば、ご教示ください。

import java.io.*;
import java.awt.*;
import java.awt.event.*;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class clickpoint extends JFrame implements MouseMotionListener, MouseListener {

JLabel label;
JPanel panel;

public static void main(String args[]) {
clickpoint MF = new clickpoint();
MF.setSize(300, 320);
MF.addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent e) { System.exit(0); };
});

MF.setTitle("Click Point");
MF.setVisible(true);
};

clickpoint() {
panel = new JPanel();
panel.addMouseMotionListener(this);
panel.setBackground(Color.green);
label = new JLabel("座標を指定");
getContentPane().add(panel, BorderLayout.CENTER);
getContentPane().add(label, BorderLayout.PAGE_END);
}

public void mouseMoved(MouseEvent e) {
Point point = e.getPoint();
label.setText("x:" + point.x + ",y:" + point.y);
}
public void mouseEntered(MouseEvent e){}
public void mouseExited(MouseEvent e){}
public void mousePressed(MouseEvent e){}
public void mouseReleased(MouseEvent e){}
public void mouseDragged(MouseEvent e) {}

public void mouseClicked(MouseEvent ec) {
try {
File OF = new File("d:\\zahyou.txt");
FileWriter FW = new FileWriter(OF, true);
FW.write(MakeData(ec.getX(), ec.getY()));
FW.close();
} catch (Exception ex) { System.out.println(ex.toString()); System.exit(0); };
};

String MakeData(int x, int y) {
String LS = System.getProperty("line.separator");
StringBuffer s = new StringBuffer();
s.append(x * 100 / getWidth() + ",90,0,");
s.append(y * 100 / getHeight());
s.append(LS);
return(s.toString());
}
}

javaを勉強中の者です。
座標の値をクリックした際にテキストファイルに出力したいのですが、どうしてもうまくできません。

調べてはいるのですが、わかりませんでした。
javaに詳しい方がいらっしゃれば、ご教示ください。

import java.io.*;
import java.awt.*;
import java.awt.event.*;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class clickpoint extends JFrame implements MouseMotionListener, MouseListener {

JLabel label;
JPanel panel;

public...続きを読む

Aベストアンサー

panel.addMouseMotionListener(this);はあるのに、なぜかpanel.addMouseListener(this);がないから。

Qイラレで画像のトンボの作り方を教えて下さい

最近、スクリーン印刷用のイラレファイルを作る機会ありまして、
普通にCS3でクリエイトトリムでトンボを配置し、入稿したところ、
「こんな意味無いトンボいりません」と職人さんに怒られました。
そして「このようにトンボつけて」とシルクスクリーン印刷の職人さんから
画像が送られてきたので、イラレCS3のメニューを探しましたが、
画像のトンボ作成メニューは見つかりませんでした。
仕方なく手作業で配置し再入稿した次第です。
このトンボは、見当トンボと言われるものなのでしょうか?
職人さんは、画像のトンボをイラレで普通に作成されているようです。
イラレでこのトンボをメニューからワンタッチで作成できるのでしょうか?
ご教授、宜しくお願い致します。

Aベストアンサー

#1です。
別に転写紙だって印刷業界には違いはないわけで・・・
転写シールのように鏡像だろうとトンボの描き方は印刷のルールですから変わりようがないんです。
(#2さんのおっしゃる「シングルトンボ」はルールとして存在します)
私自身、四半世紀は印刷業界(アナログ時代を含めて)に係わっていますが、こんなものを「トンボ」と言っている方にあったことがありません。

どうしてこんな風なものになってしまっているのかは全く不明ですし、どうやって付けているのかも不明です。
一応クリエイト>>トリムマークで作成した角トンボを各角(すみ)ごとのセットを個別に「ダイレクト選択ツール」で選択して中心点で180度回転すれば出来なくはないですが、なんの意味があるか全く不明です。

昔はトンボはカラス口で書いたり、シールでぺたぺた貼っていたのでその時に覚え間違えたとか?でしょうか・・・

Qjavaの初心者ですm(__)m

私の環境はWIN98SEです。


JDKのコマンド群をどこのディレクトリからでも使えるようにするため、 PATHの設定をするため、
タスクバーの左にある[スタート]メニューの[ファイル名を指定して実行]を選び、名前のところに、 syseditと入力しシステムエディタというエディタが開き
AUTOEXEC.BATのウィンドウの
PATH C:\WINDOWS;C:\WINDOWS\COMMAND;C:\DOS
という行の後ろに、Javaのコマンドファイルが入っているディレクトリ名を追加します。
c:\Appというディレクトリの下にJDKをダウンロードしたのなら、
PATH C:\WINDOWS;C:\WINDOWS\COMMAND;C:\DOS;C:\App\java\bin
となります。
これで、Javaの環境はOKです。」

ということでわけもわからずそのとおりにしました。
「c:\Appというディレクトリの下にJDKをダウンロードしたのなら、・・」というところがありますが、私の場合、javaはどこにインストールされたのか、見ると、マイコン→Cドライブ→プログラムファイルのなかにあったので、「C:\Program file\java\bin」と入力すればいいのでしょうか??
PATHが正しく設定されていると、DOS窓を開き、setと入力すると、PATHのところに、syseditで追加したディレクトリの名前があればOKです。(上記例では、C:\App\java\bin)
名前が無かったり、名前にミスがある場合は、もう一度、syseditの作業を行って、Windows95を再起動してください。
名前がきちんと追加されているのに、うまく行かない場合は、
javaのコマンドファイルのある場所を勘違いしている可能性がある・・らしいのですが、
DOSをひらいてsetとしてみても、C:\App\java\bin(例)のようななまえ、私の場合はC:\Program file\java\binでしょうか・・?これがないのです。
どうしたらいいのでしょう?

私の環境はWIN98SEです。


JDKのコマンド群をどこのディレクトリからでも使えるようにするため、 PATHの設定をするため、
タスクバーの左にある[スタート]メニューの[ファイル名を指定して実行]を選び、名前のところに、 syseditと入力しシステムエディタというエディタが開き
AUTOEXEC.BATのウィンドウの
PATH C:\WINDOWS;C:\WINDOWS\COMMAND;C:\DOS
という行の後ろに、Javaのコマンドファイルが入っているディレクトリ名を追加します。
c:\Appというディレクトリの下にJDKをダウンロードしたの...続きを読む

Aベストアンサー

余計なおせっかいかもしれませんが。

本当にJDKのディレクトリは C:\Program Files\Java ですか?
最近のJDKは、デフォルトでは C:\j2sdk1.4.0 のように、ドライブのルートディレクトリにJava用のディレクトリを作成するので、あなたが特に指定したのではない限り、C:\Program Files\Java にSDKは無いと思うのですが。

ちなみに、C:\Program Files\Java に通常インストールされるのはJRE(Java実行環境)で、SDKとは異なります。

SDKをインストールしたディレクトリをもう一度調べてみてください。

また、ディレクトリの名前に空白が含まれる場合は、Pathに設定する時にクォーテーションマークで囲んだほうが間違いが無いと思います。

もしProgram Files\JavaにPathを設定するなら)
PATH C:\WINDOWS;C:\WINDOWS\COMMAND;"C:\Program Files\Java"

Qトンボについて

京都府宇治市の者です。
先日、九月の初めにスーパーの駐車場で車の中に居たら窓に何度もトンボが寄ってきました。
 水とガラスを間違えたのか、産卵か交尾の行動をしていました。
そのトンボについての質問ですが、胸以下が赤色系で頭部はパステル調の緑色でした。
 その美しさに暫く見とれていたのですが、後で調べても中々何と云う名前のトンボだったのか判りません。
 アカネ(アキアカネ)に近いのですが、情報から大きさが大きすぎる様に思います。
 大きさは、オニヤンマ等の大型と赤トンボ等の小型の中間位で、シオカラトンボより一回り大きく思いました。
 兎も角、赤と緑の色調が美しいトンボでした。

この程度の情報で絞れるトンボは何トンボでしょうか?

Aベストアンサー

「カオジロトンボ」では?
    ↓
 http://www.jomon.ne.jp/~tomboy/page004.html#カオジロ2
(スクロールして、他の「カオジロ」も見てください。)

ただ、「北方系」のトンボらしいので、京都に現れるか疑問ですが。
紹介した写真のサイト、かなり詳しくトンボの絵が見られますので、
一度、すべてご覧ください。

・・・このトンボ、私も知りませんでした。

Qjava初心者です。座標取得と図形表示について

マウスをクリックするとその座標を表示するプログラムです。
画面には常に二つの四角形が表示されていて、どこをクリックしたかによって表示が変わるというものです。
(オレンジの四角形内をクリックした場合、
X:100 オレンジ
Y:100 オレンジ
のように表示します。)

ですが、私が組んでみたプログラムでは図形表示が一瞬だけになってしまいます。
また、ウインドウの大きさを動かしてみると一瞬移っては消えてしまうという状態です。

それから、「オレンジ」などの日本語表示がうまくいかず「□□□」のように表示されてしまいます。

これらの問題を解決するにはどこをどう修正したらよいでしょうか?
以下が初心者なりに組んでみたソースです。

import java.awt.Color;
import java.awt.Graphics;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.Toolkit;
import java.awt.Graphics2D;
import java.awt.Graphics;
import java.awt.Font;
import java.awt.Rectangle;
import java.lang.String;
import java.lang.System;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class kadai33 extends JFrame
{
private static final long serialVersionUID = 1L;
public kadai33()
{
add(new DrawPanel());

}

public static void main(String[] args)
{
Toolkit.getDefaultToolkit().setDynamicLayout(true);

JFrame f = new kadai33();
f.setTitle("マウスの座標を表示");
f.setDefaultCloseOperation(EXIT_ON_CLOSE);
f.setBackground(Color.WHITE);
f.setSize(400, 750);
f.setVisible(true);
}



class DrawPanel extends JPanel implements MouseListener
{
int x;
int y;

public DrawPanel()
{
setBackground(Color.white);
addMouseListener(this);
}
public void mouseEntered(MouseEvent e){}
public void mouseExited(MouseEvent e){}
public void mousePressed(MouseEvent e){}
public void mouseReleased(MouseEvent e){}
public void mouseClicked(MouseEvent e)
{
x = e.getX();
y = e.getY();
repaint();
}

public void paint(Graphics g)
{

Font font=new Font("Arial",Font.PLAIN,16);
super.paintComponent(g);
//super.paint(g);

Graphics2D g1 = (Graphics2D)this.getGraphics();
Rectangle rect = new Rectangle();
rect.setRect(50,50,200,200);
g1.setColor(Color.ORANGE);
g1.fill(rect);

Graphics2D g2 = (Graphics2D)this.getGraphics();
Rectangle rect2 = new Rectangle();
rect2.setRect(150,350,150,150);
g2.setColor(Color.GREEN);
g2.fill(rect2);

Graphics2D g3 = (Graphics2D)this.getGraphics();
Rectangle rect3 = new Rectangle();
rect3.setRect(50,650,200,50);
g3.setColor(Color.BLACK);
g3.fill(rect3);


if(x>=50 && x<=250 && y>=50 && y<=250){
super.paintComponent(g);
String sx = String.format("X:%d", x);
String sy = String.format("Y :%d", y);
g.setFont(font);
g.setColor(Color.BLACK);
g.drawString(sx, 65, 670);
g.drawString(sy, 65, 690);

Graphics2D g4 = (Graphics2D)g;
g4.setFont(font);
g4.setColor(Color.WHITE);
g4.drawString("オレンジ",120,670);
g4.drawString("オレンジ",120,690);

}
if(x>=150 && x<=300 && y>=350 && y<=500){
super.paintComponent(g);
String sx = String.format("X:%d", x);
String sy = String.format("Y :%d", y);
g.setFont(font);
g.setColor(Color.BLACK);
g.drawString(sx, 65, 670);
g.drawString(sy, 65, 690);

Graphics2D g5 = (Graphics2D)g;
g5.setFont(font);
g5.setColor(Color.WHITE);
g5.drawString("グリーン",120,670);
g5.drawString("グリーン",120,690);
}
else{
super.paintComponent(g);
String sx = String.format("X:%d", x);
String sy = String.format("Y :%d", y);
g.setFont(font);
g.setColor(Color.BLACK);
g.drawString(sx, 65, 670);
g.drawString(sy, 65, 690);

Graphics2D g6 = (Graphics2D)g;
g6.setFont(font);
g6.setColor(Color.WHITE);
g6.drawString("対象外",120,670);
g6.drawString("対象外",120,690);
}

}



}

}


大変困っています。
どうかよろしくお願いいたしますm(__)m

マウスをクリックするとその座標を表示するプログラムです。
画面には常に二つの四角形が表示されていて、どこをクリックしたかによって表示が変わるというものです。
(オレンジの四角形内をクリックした場合、
X:100 オレンジ
Y:100 オレンジ
のように表示します。)

ですが、私が組んでみたプログラムでは図形表示が一瞬だけになってしまいます。
また、ウインドウの大きさを動かしてみると一瞬移っては消えてしまうという状態です。

それから、「オレンジ」などの日本語表示がうまくいかず「□□□」のよう...続きを読む

Aベストアンサー

豆腐になるのは文字コードの問題かな?

長方形を描くごとにいちいちグラフィックスコンテキストを取得するのはなぜだろう.

Qイラレ:最近のトンボの作り方

私は、イラレでトンボを作るとき、実サイズより少し大きめにアートボードを設定して、その中に実サイズのトンボを制作していました。

例:A4を作るときの手順
230 x 320のアートボードを設定
その中に210 x 297の四角形を作りトリムマークを作成

この様に作成をしていました。

しかし、先日、ある知り合いに「君のトンボの作り方は古い、最近はアートボード自体を210 x 297に設定をする」と言われました。
そこで、さっそく作ってみたのですが、プリントする時にアートボードの内側しかプリントされないので、どうやってもトンボが印刷されません。

例:210 x 297のアートボードに210 x 297のトンボを付けるとアートボードの外にトンボが表示されます。しかし印刷範囲はアートボード内なので外側のトンボが表示されない。

プリントの画面で「アートボードを無視」というチェック項目がありますが、これをするとアートボードを実サイズにした意味がないのではないかと思います。

この人にはなかなか会う機会がないのでここで質問させていただきます。

みなさんはどの様にトンボを作っていますか?

よろしくお願いします。

私は、イラレでトンボを作るとき、実サイズより少し大きめにアートボードを設定して、その中に実サイズのトンボを制作していました。

例:A4を作るときの手順
230 x 320のアートボードを設定
その中に210 x 297の四角形を作りトリムマークを作成

この様に作成をしていました。

しかし、先日、ある知り合いに「君のトンボの作り方は古い、最近はアートボード自体を210 x 297に設定をする」と言われました。
そこで、さっそく作ってみたのですが、プリントする時にアートボードの内側しかプリントされないので...続きを読む

Aベストアンサー

ご質問は
どうやってトンボを印刷するかですよね。

アートボードは仕上がりサイズで作成して下さい。

「プリント...」で開くダイアログで
左側にある「トンボと裁ち落とし」というのをクリックして下さい。
「トンボ」の所でチェックを入れて
(私は通常トンボとレジストレーションマークの2つのチェックで使ってます)

裁ち落としがある場合は、
「裁ち落とし」の所で数値を入力
通常は3mmでしょうか。
それから、
※重要→プリント...のトンボを使わず、作成したトリムマークをプリントしたい場合、ここの数値を20mmとか大きめに入力しておけばOK。
(要はアートボードより外側どれ位の範囲をプリントしますかってことなので)

仕上がりより大きいサイズの用紙を指定して

プリント。

Qjava リアルタイムでマウスの座標を取得したい

マウスのリアルタイム座標を取得したいのですが、
以下のソースを作りました。
しかし、リアルタイムどころか、マウスをクリックしても座標が取得できません

どこを修正すればいいのでしょうか?






import java.applet.Applet;
import java.awt.*;
import java.awt.event.*;
import java.awt.event.MouseEvent;
import java.net.URL;
importjava.awt.Image;

/*<applet code="applet001" width="640" height="480"></applet>*/

public class applet001 extends Applet implements MouseListener, MouseMotionListener
{
Dimension dim;

intmouse_x, mouse_y;

//アプレットの初期化時呼び出される
publicvoidinit()
{
dim = getSize();
addMouseListener( this );
}


publicvoidupdate(Graphics g) //オーバーライドして最低限のことだけをする
{
paint(g);
}
publicvoidpaint(Graphics g)
{
g.drawString( "マウス:" + mouse_x + "," + mouse_y, 60, 120 );
g.fillOval(mouse_x,mouse_y,30,30);
}


//マウスの処理
publicvoidmousePressed( MouseEvent e )
{
mouse_x = e.getX();
mouse_y = e.getY();
}
publicvoidmouseClicked( MouseEvent e )
{}
publicvoidmouseReleased( MouseEvent e )
{}
publicvoidmouseEntered( MouseEvent e )
{}
publicvoidmouseDragged( MouseEvent e )
{}
//
publicvoidmouseExited( MouseEvent e )
{}
//
publicvoidmouseMoved( MouseEvent e )
{
mouse_x = e.getX();
mouse_y = e.getY();
repaint();
}
}

マウスのリアルタイム座標を取得したいのですが、
以下のソースを作りました。
しかし、リアルタイムどころか、マウスをクリックしても座標が取得できません

どこを修正すればいいのでしょうか?






import java.applet.Applet;
import java.awt.*;
import java.awt.event.*;
import java.awt.event.MouseEvent;
import java.net.URL;
importjava.awt.Image;

/*<applet code="applet001" width="640" height="480"></applet>*/

public class applet001 extends Applet implements MouseListener, MouseMotio...続きを読む

Aベストアンサー

MouseMothionListenerの追加は、addMouseListener()ではなく、addMouseMotionListener()です。

Qトンボは、目を回してしまうのですか?。

トンボをつかまえる時、指を回しながら、トンボの目に近づけていく方法があります。トンボは、目回っているんでしょうか?。
乗り物酔いがひどいわたしは、トンボより先に目が回ってしまいそうです。少し気持ち悪くなってきました・・・。

Aベストアンサー

 こんばんは! gingakeiさん。
そうですね、あれは目が回っていると言うよりは、指の動きをじっと見てるといった方が当たっているかもしれません。ぐるぐる回しながら近づくと必ず小首をかしげて指の動きに全神経を集中させます。私も子供の頃に指を回しながらトンボを捕まえる少年でした。網で捕獲するのではなく指で捕まえるのですからそれはそれは気分が高揚します。でもライオンの狩りではありませんが、成功率は2~3割といったところでした。難しいのは止まったトンボに近づくまででした。止まっているトンボに接近できたら捕獲成功率ほぼ8~9割。小首を傾げたら捕獲成功率はほぼ100%でした(この小首をかしげるシーンが「目を回した」と勘違いさせる原因だったのでしょう)。でもトンボもさるもの引っ掻くもの、なかなかそこまでの接近戦に持ち込ませてくれないのですよ。
 少年時代の憧れのトンボは、オニヤンマでした。ギンヤンマは何とか捕獲できても、オニヤンマはなかなか…。(あ、私、ご質問とは関係のないことを…(^_^;))
いつもいつもgingakeiさんのご質問のお陰で童心に戻れます。失礼致しました。

 こんばんは! gingakeiさん。
そうですね、あれは目が回っていると言うよりは、指の動きをじっと見てるといった方が当たっているかもしれません。ぐるぐる回しながら近づくと必ず小首をかしげて指の動きに全神経を集中させます。私も子供の頃に指を回しながらトンボを捕まえる少年でした。網で捕獲するのではなく指で捕まえるのですからそれはそれは気分が高揚します。でもライオンの狩りではありませんが、成功率は2~3割といったところでした。難しいのは止まったトンボに近づくまででした。止まっている...続きを読む

Qマウス座標の値を保存する方法を教えてください。

座標を保存する変数1 = atan2(クリックした次のy座標 - 最初のy座標 , クリックした次のx座標 - 最初のx座標);
座標を保存する変数2 = 円周率 * 2 + tmp;

これをソース化しようと思ったんですが、座標は見ることができても、座標の値を保存することができません。

ボタンを押すとボタンを押したときの座標に代わってしまいます。
どうすれば、古い座標(ひとつ前にクリックした座標)を保存できますか?
一応、作業用フォルダを用意して入れ替えみたいなことしたんですが、だめでした。

<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>

<script>
function getMouseX(e){
document.xx.client_x.value=e.clientX;
}
document.onmousedown=getMouseX;
function CL1(){
var a=document.xx.client_x.value;
var tmp;
tmp=a;
/*
どんなコードを書けばいいかわかりません。
*/
alert(tmp);
}
</script>

<form name="xx">
<input type="text" name="client_x">
<input type="button" value="CLICK!" onClick="CL1()">
</form>

</body>
</html>

座標を保存する変数1 = atan2(クリックした次のy座標 - 最初のy座標 , クリックした次のx座標 - 最初のx座標);
座標を保存する変数2 = 円周率 * 2 + tmp;

これをソース化しようと思ったんですが、座標は見ることができても、座標の値を保存することができません。

ボタンを押すとボタンを押したときの座標に代わってしまいます。
どうすれば、古い座標(ひとつ前にクリックした座標)を保存できますか?
一応、作業用フォルダを用意して入れ替えみたいなことしたんですが、だめでした。

<!doctype html...続きを読む

Aベストアンサー

ボタンをクリックした時に、両方のイベントが発生して両方の処理がおこなわれてしまうのが、ややこしくしている元ですが・・・

実は、要素の包含関係によって、イベントの発生順序が決まっています。
http://vird2002.s8.xrea.com/javascript/DOM-Level-2_Event_bubbling.html
なので、button → document の順だと思っていたら、documentの方が上位要素なのに先に実行されていますね。

おやっ、と思って良く見たら設定がmousedownとclickとで異なっているので、mousedownイベントが先に起こり、続いてclickイベントが起きているからですね。
両方をクリックにしてみれば、処理順が逆転するので、お悩みが何もせずに解決することがわかるかと思います。


さて、イベント発生はそのままにしておくとして・・・
対処法の一つとしては、質問者様がなさろうとしていたように、1個前の値を変数に覚えさせておいて、それを表示する方法が考えられます。
ご提示のスクリプトだと、残念ながらその意図の通りにはなっていません。
順序をよく考えてみれば、
 ・値を記入する時に、記入する前に、前の値を変数に覚えさせておく
 ・ボタンクリックの際は、常に(変数にある)古い値を表示
というような要領で行えばよろしいかと思います。

そうすると、こんな感じ。

var oldValue; //前の値を記憶するための変数

document.onmousedown = function(e){
oldValue = document.xx.client_x.value;
document.xx.client_x.value = e.clientX;
}

function CL1(){
alert(oldValue);
}


ところで、実際のところどのようなことをなさりたいのかはよくわかりませんが、ややこしくなっている原因は上記のように重複した処理が別個に動作することにあります。
別の対策方法として、ボタンを特別に扱って
・documentのclick(やmousedown)の処理で、ボタンを押したときは何もしないようにする。
ことでも対処できるかと思います。(ボタンを押したときは値が変わらなくなる)
イベント発生元の要素は、event.targetなどで取得することができますので、これによって処理を振り分けることで実現できます。

どうせ振り分けるなら、そこでボタンを押したときの処理を行うようにしてしまえば、ボタンクリックのイベント処理を削除できますね。
画面上のclick(やmousedown)は全てdocument要素で拾えますので、ここで包含的に処理することで、個別の処理する場合の順序などを考えなくても済むようになります。

そんな考え方の例(若干動作が変わっていますが)
※ ボタンを識別し易くするためにidを追加しています。
<!doctype html>
<html lang="ja">
<head>
<script>
document.onclick = function(e){
var t = e.target, elm = document.xx.client_x
if(t.id == "button1") alert(elm.value);
else elm.value = e.clientX;
}
</script>
</head>
<body>
<form name="xx">
<input type="text" name="client_x">
<input type="button" id="button1" value="CLICK!">
</form>
</body>
</html>


実は、上記のものでは動作しないブラウザがあります。
一つは、要素の指定の方法。
document.xx.client_x のような方法はうまくいかない場合があります。
idやclassやtagNameを利用して、getElementById()やquerySelector()などで特定する方法をお勧めします。
もう一つはイベントの設定とイベント要素の取得
document.onclick = function(e){ ~~
では、eにイベント要素が返されないブラウザがあったり、event.targetやevent.clientXでは意図する内容が取得できない場合があります。

これらは、ブラウザごとの個別の仕様によるバラツキが直接の原因なので、本質的ではないとはいうものの、実際には対処が必要で、面倒な要因の一つになっていると言えます。


・・・って、ここまで書いている間に、ANo1様がブラウザごとの差を吸収する回答をなさっているようですので、このあたりに関してはそちらを参考になさってください。

長文失礼。

ボタンをクリックした時に、両方のイベントが発生して両方の処理がおこなわれてしまうのが、ややこしくしている元ですが・・・

実は、要素の包含関係によって、イベントの発生順序が決まっています。
http://vird2002.s8.xrea.com/javascript/DOM-Level-2_Event_bubbling.html
なので、button → document の順だと思っていたら、documentの方が上位要素なのに先に実行されていますね。

おやっ、と思って良く見たら設定がmousedownとclickとで異なっているので、mousedownイベントが先に起こり、続いてclickイベ...続きを読む


人気Q&Aランキング

おすすめ情報