古典籍ビューワオプション設定

古典籍ビューワでは、設定ファイル(app_conf.js)の記述によって動作をカスタマイズできる。

設定

TEIViewer(config)

configは次に挙げるプロパティを持ったオブジェクト

項目名 説明
xmlidPickup Array.<xmlidPickupObject> xml:id参照関係のリスト表示に関する設定を行う
typeToGraphLabelMapping Object xml:id参照関係のグラフ表示に関する設定を行う
enableGraph Boolean グラフ表示機能の有効・無効を設定する
openSeadragon Object OpenSeadragonに関する設定を行う

xmlidPickupObjectは次に挙げるプロパティを持ったオブジェクト

項目名 説明
selector String (必須)xml:id参照関係のリスト表示対象とする要素のセレクタ表現
label String リスト表示のタブ見出しに用いる表示名

xmlidPickup

xml:id参照関係のリスト表示(ビューワ右側に表示される)について、表示対象とする要素を指定する。

例えば、以下のTEI/XMLに対し、「@type属性の値が『題』であるseg要素に設定されたxml:idを対象とし、そのidを参照している要素を抽出して可視化する」ことを考える。

<seg type="題" xml:id="題1">旅宿</seg>
<phr corresp="#題1">草まくら</phr>

この動作は、xmlidPickupの値として以下を設定することで実現される。

xmlidPickup: [
    {
        selector: 'seg[type="題"]',
        label: '題'
    }
]

selectorには「@type属性の値が『題』であるseg要素」を意味するセレクタ表現を指定している。

また、リスト表示のタブ見出しはデフォルトではselectorで指定した文字列となる。表示を分かりやすくするには、あわせてlabelの指定を行う。

typeToGraphLabelMapping

xml:id参照関係のグラフ表示(ビューワ下部に表示される)について、参照元ノードと参照先ノードを繋ぐ矢印のラベルを指定する。

グラフにおいて、参照元ノードと参照先ノードを繋ぐ矢印のラベルは、参照元要素の@type属性の値(@type属性が付与されていない場合はタグ名)としている。

typeToGraphLabelMappingに、@type属性の値をキーとし、矢印のラベル表示名を値とするペアを設定することによって、矢印のラベルを変更できる。

例えば、以下のTEI/XMLにおいては、@type属性の値を「kakusen」「hyosen」とローマ字で記述しており、矢印のラベルは「kakusen」「hyosen」となる。

<seg type="sutra" xml:id="mondo01.01">爾時大慧菩薩摩訶薩復白佛言</seg>
<seg type="kakusen" corresp="#mondo01.01">起詞</seg>
<seg type="hyosen" corresp="#mondo01.01">起段。結集家置。爾時及復解皆見上。</seg>

このとき、typeToGraphLabelMappingに以下を設定することで、矢印のラベル表示を「kakusen」から「格箋」、「hyosen」から「平箋」に変更することができる。

typeToGraphLabelMapping: {
    'kakusen': '格箋',
    'hyosen': '平箋'
}

enableGraph

グラフ表示機能の有効・無効を設定する。

未設定またはtrueの場合はグラフ表示機能が有効となり、falseの場合は無効となる。

openSeadragon

OpenSeadragonに関する設定を行う。

次に挙げるプロパティを持ったオブジェクトを記述する。

項目名 説明
highlight Boolean <zone>のハイライト表示有無を設定する。未設定またはtrueの場合はハイライト表示される。

設定例

(function() {
    const config = {
        xmlidPickup: [
            // selectorは必須、labelは任意(未設定の場合selectorを使用)
            {
                selector: 'seg[type="題"]',
                label: '題'
            },
            {
                selector: 'person',
                label: '人物'
            }
        ],
        typeToGraphLabelMapping: {
            'kakusen': '格箋',
            'hyosen': '平箋',
            'chisen': '智箋'
        },
        enableGraph: true,
        openSeadragon: {
            highlight: true
        }
    };
    return TEIViewer(config);
})();