六帖webアプリ
kickzone/TrainNavi2 · GitHub
かなり進んだ。スクロールと拡大縮小、さらにオブジェクトの省略まで同時に実装できるとは思わなかった。次は、パッケージファイルの読み書きが一番大きな変更になりそうだ。
既知の不具合：スクロールすると線路が途切れることがある

1点ハマったこととして、firefoxはマウスホイールイベントが特殊で、mousewheelではなくDOMMouseScrollとかいうイベントを使わないといけないらしいです。クロスプラットフォームなコードは次の通り。

function OnCanvasMouseWheel(e){
var toScale = scale;
e.preventDefault();
var delta = e.originalEvent.deltaY ? -(e.originalEvent.deltaY) : e.originalEvent.wheelDelta ? e.originalEvent.wheelDelta : -(e.originalEvent.detail);
if (delta > 0){
toScale /= 2;
} else {
toScale *= 2;
}
SetScale(toScale);
return false;
}
canvas.addEventListener("mousewheel" , OnCanvasMouseWheel, false);
var mousewheelevent = 'onwheel' in document ? 'wheel' : 'onmousewheel' in document ? 'mousewheel' : 'DOMMouseScroll';
$("canvas").on(mousewheelevent, OnCanvasMouseWheel);

Tweet