Spriteを拡大した時の表示範囲がおかしい[FireFox, IE]

[coelacanth9]

こんにちは。 enchant.jsのライブラリに入っている[map0.png]を使用してマップチップを表示しています。16*16の絵が並んでいる素材です。 拡大率が小さい場合は分かりにくいですが、5倍くらいに拡大させた時、表示されている絵の端の部分に、指定しているframeの隣のframeの絵が入り込んでしまっているように見受けられます。

確認方法としまして、map0.pngのframe=2にあたる、肌色のマップチップ素材の左端(Windows Paintで開いた時の32pixelの列)に赤色を塗ります。 そして下記コードのように、frame=1にあたる、青色のマップチップ素材を拡大して表示します。 すると、拡大表示された青色のマップチップの右端に、先ほど手を加えた肌色のマップチップの一番左にある赤い色が表示されている事が確認できます。

enchant();
window.onload = function(){
var core = new Core(320, 320);
    core.rootScene.backgroundColor = "black";

core.preload('./img/map0.png');
core.onload = function(){
    var chip = new Sprite(16, 16);
    chip.image = core.assets['./img/map0.png'];
    chip.frame = 1;
    chip.x = 100;
    chip.y = 100;
    chip.scaleX = 7;
    chip.scaleY = 7;
    core.rootScene.addChild(chip);
}
core.start();
};

この現象はFireFox19.0.2、InternetExplorer 9.0.8112.16421 で確認しております。 Google Chrome 25.0.1364.172 m　では正常に表示されております。

これは何か対処法がありますでしょうか？

[環境] OS Windows7 64bit enchant.jsバージョン v0.6.3 IDE WebStorm 6.0

[sidestepism]

IE 9.0.8.112 / IE9 Mode / IE9 Document

[sidestepism]

Firefox release ch. 19.0.2

[sidestepism]

Safari 6.0.2 (8536.26.17)

scale = 2.51875;

scale = 1;

Safari の場合は、拡大率に関係なく出るようです。

[rtsan]

8259cc93261e4efad31bfd396ca9330751086b41

[sidestepism]

現状のバージョンでは、隣接して使用されないマップチップ同士を離して配置して利用するなどの対処法があります。スプライトひとつひとつに対応する Surface を生成する方法もありますが、オーバーヘッドが大きくなってしまうため、別の方法での対応を検討中です。

[sidestepism]

実験用ファイル

[coelacanth9]

sidestepism さん rtsan さん ご回答ありがとうございます。

実験用ファイルを作ってみました。 上記画像で、frame=4で表示すると、四方に対して隣のセルの色が入ってきてしまっているので、 離して配置するというのは、下記画像のような意味でしょうか？

すみません。sidestepismさんの実験用ファイルの意味が分かっていませんでしたが、今分かりました。とりあえずはsidestepismさんの2番目のファイルのように交互になるようにして対応します。