annotator.jsとは

annotator.jsとは、注釈作成用のjQurryプラグインです。
現在世の中にある注釈作成関係のプラグインではいちばん使いやすいと思います。

ショーケースページではいろいろなサイトが紹介されています。 使ってみましたが、使い勝手はなかなかなものです。
ただし、カスタマイズをしたいという話になると、とたんに最強レベルに面倒なプラグインです。

導入方法

「GitHubから最新版をダウンロードします」というはずなんだけど、GitHubのリリースページにより新しいバージョンが存在することがあります。
最新版のJavaScriptとCSSを読み込ませたあと、コードを読ませます。

あとは指定したidやclass上でドラッグするとプラグインを利用可能です。
基本はこれだけです。CSSをカスタマイズするとテーマの作成も可能です。

利用上の注意

IE9以上で動きますが、Webサービスに使う場合はIE10以上の「まともな」ブラウザを対象にすることをオススメします。IE9だと複数の領域で利用しようとするとエラーがでます（そもそも、IE9が「まともな」ブラウザかどうかは知りませんよ。さっさと窓から投げ捨ててしまいましょう）。

テンプレートの作成について

某案件で使ったときは、テンプレートをカスタマイズしました。
これが恐ろしいほど面倒でした。リバースエンジニアリングしている気分でしたね（笑）。

このプラグインに関しては、「テンプレートを作る」ではなく「プラグインを作る」イメージで作った方がいいです。Plugin developmentを読んでもいまだに分からないです（笑）

まとめ

annotator.jsの簡単な紹介を書いておきました。

APIとJSONをつかえばデータも管理できます。カスタマイズしていけばいろいろできます。
だた、使いこなせば非常に強力ですが、テンプレート作成のコストがすごくかかるプラグインなことは覚えておいた方がいいです。