今日も、あんまり vue.js は関係ないのですが、OpenSeadragonを組み込むのは割と簡単でした。
vue-openseadragonっていうのもあって、それだとreactiveに扱えそうなのですが、 組み込まれているOpenSeadragonのバージョンが一つ前なので、やめて、オリジナルを そのまま組み込みました。 src/App.vueに
import OpenSeadragon from 'openseadragon/build/openseadragon/openseadragon.min.js';
っていう風にすれば組み込めました。あとは普通にmethods:以下のどこかに書いていけば いいようです。
複数画像を読み込ませる時は tileSources: に複数のタイルソースを書いていけばよく、 たとえば、info.jsonファイルのURLを配列で列挙していくことになります。これも reactiveにできるのかもしれませんが、今のところあまりメリットを想像できなかった ので、とりあえずtileSources:の中身はmethodsの中で完結させています。
それから、OpenSeadragon、ローカルファイルでも、ファイル名を指定するだけで読み込める んですね。本日、主に試していたのはその機能に関することでした。 ユーザ側が混乱しないか注意する必要がありそうですが、これはこれで活用したい ところです。
