CreateJSで図形をドラッグして動かしたい

Question

JavaScript

CreateJSを用いて図形をドラッグして動かしたいのですが、エラーが出てドラッグできません。
canvasに図形は描写されています。

発生している問題・エラーメッセージ
Uncaught TypeError: eventObject.addEventListener is not a function

var stage;
function initialize() {
  var canvasElement = document.getElementById('mycanvas');
  stage = new Stage(canvasElement);
  for (var i = 0; i < 2; i++) {
    var myShape = createCircle (50 * (i + 1), 50, 20);
    myShape.addEventListener("mousedown", startDrag);
    stage.addChild(myShape);
  }
  stage.update();

}
//図形描写　ランダムなカラーの円２つ
function createCircle(nX, nY, nRadius) {
  var myShape = new Shape();
  myShape.x = nX;
  myShape.y = nY;
  draw(myShape.graphics, nRadius);
  return myShape;
}

function draw(myGraphics, nRadius) {
  var randomNumber = Math.floor(Math.random() * 0xFFFFFF);
  var randomColor = Graphics.getRGB(randomNumber);
  myGraphics.beginStroke('blue');
  myGraphics.beginFill(randomColor);
  myGraphics.drawCircle(0, 0, nRadius);
}
//ここでエラー発生
function startDrag(eventObject) {
  eventObject.addEventListener("mousemove", drag);
}

function drag(eventObject) {
  var instance = eventObject.target;
  instance.x = eventObject.stageX;
  instance.y = eventObject.stageY;
  stage.update();
}

参考書のコードをそのままかいているのですがエラーになってしまいます。
プログラミング初心者ですがご回答いただけると助かります。

Comments

[yasutomi]

タイトルがまぎらわしいので「CreateJS」にしたほうが良いです。
あと質問はコードブロックを使用してください。
```js

```

[nino8752]

申し訳ありません、修正いたしました。

Answer 1

参考書のコードが古すぎるのではないでしょうか。

var Stage=createjs.Stage;
var Shape=createjs.Shape;
var Graphics=createjs.Graphics;

と修正しないと動きませんでした。このことからの推察です。

検索したらドラッグが動いているコードを見つけられました。

https://ics.media/tutorial-createjs/mouse_drag/
の「サンプルを再生する」

こちらのコードに合わせて修正すればドラッグを動かすことができるでしょう。

例えば
myShape.addEventListener("mousedown", startDrag);
を
myShape.addEventListener("pressmove", drag);
に変えてmousedownやstartDragが完全になかったことにします。

Comments

[nino8752]

mousemove,mouseupイベントは廃止されてpressmove,pressupになっていたんですね。ただ、それにともなって引数にわたすオブジェクトも変わっているみたいでそのまま変えただけでは動きませんでした。回答のURLのコードでは動いたのでドラッグの動作は確認することができました。ありがとうございました！！