Vue

概要 「前近代日本-アジア関係資料デジタルアーカイブ」が2025年7月25日に公開されました。 https://asia-da.lit.kyushu-u.ac.jp/ また、以下でビューアが公開されています。 https://github.com/localmedialabs/tei_comparative_viewer 本記事では、本ビューアを試した記録を共有します。 結果、以下のように、セルフホストすることができました。 https://tei-comparative-viewer.aws.ldas.jp/ 以下の「海東諸国紀」のXMLファイルを読み込んでいます。 https://asia-da.lit.kyushu-u.ac.jp/viewer/300 ローカルで起動する 以下に丁寧な説明がなされていますので、手順にしたがって起動させることができました。 https://github.com/localmedialabs/tei_comparative_viewer/blob/main/docs/SETUP.md サーバで起動する サーバで起動するにあたり、Dockerを用いて起動しました。 フォークしたリポジトリは以下です。 https://github.com/nakamura196/tei_comparative_viewer/tree/docker-traefik-setup 以下のようなファイルを用意しました。 F # R # R # R # C # W # C # R # R # R # C R # C # C # R # R # R # E # R # C R U U U O O O U U U O U O O U U U X U M O I N C N I N G P S R C P I N I N R N C P N C P C P C N G N O N E P C N S D M n l n e Y e K o Y n n e o Y o Y o Y r e p x O r t s a g c l l l z u n n n s e a s d t t D p s c s n m r p l p p e m & & & n p t p p p p S e m a [ p t p i u i i i i n o p g u a p t o I y . t o t p o m y d n y d y d a k & & & e h i h h h o E a k r " h a t t r b b b p z d m i p r t a c l - w R a m a m v o o o t d r p m p p p s t d t / p l - l p o x i e n e - l k a f o e l p l e - n c - P c s c e i c c c a i e 8 e i u : l g n n m \ p j \ x r c g l e t r r x v l o l i f g k s H k u k r h h h t a z a a a 0 r s s 8 e g i l s v a e r e o k v i a s n d i e P e p e n o m m e r e r r r p P u r . s t - g 2 \ i c t P - s m i a s r d e a s e / n r - r e r e - w o o t t t t o H - p / 2 y d - - s h H p t = n r t / e r n t f e x e F / r / c p n d d k i L i i i r P p e b - s u e d d o e c P h c g / i w p d a a t n t P p s e e s a s s s t - r i f t p v e e r l p C o w n w e i l u c c g c M h i u s - - - y a r a a a F v n p e d v v e e - o m d w g w n n b l l / o i / p s p s v R R R n a n n n 8 P v i / m m a a x e m p i w d s u t n n n n c o e a a v 0 M a s s t n t x p o r a e t i & g f x g w r r r r w 7 7 k e c r v r o u d e e t o s e p n a l & n i i / i n w v y / w 5 5 e l o o i s r p e & n - s e c p c l d g n g a n f w c i l w 5 5 y n u e r d e p & & s i e r t l i l n i x p x i . o s d o - : f t w c u r e & i n r : o i e f p n / p g c n o i g d g i e : k n v n r o s l r c s r m x s . s o f r r / a v e g : c e / i d a m n t a y a - o i c i n i / e s t a a n : c a t p s e p s a t t n n r s t o t f g s c u a r r e c a c h o n t - l e i o t u i e n e u t p : / / r a c h d p r c - r l s o - e n t s f s / p o e w w w a c h e i d i g f t n d n e - - u e r r w w w t h e r " e e m e d b e / a s r i v w w w e e e , s t b / d v u n e v r v e i - / / & c v s u i a i a t a / i s s d s b & & t " i a t s r s l b c i l s o a t o & o - n r r r e s d l / l o o a r t o o \ r c s / i / c o e e n a c r n a r t \ y " t l n b t p t d g b a d d \ a s , a i g i o t s / i l l . g t l b n r i d n e / c s v e r " l / e / y m e x e o e a a / a x c i f a t n t r \ p e - p i o c z a s p c f / / t y t f m o e u i p / p w c c / p n - l t . p / e w a / \ l p o t a t e c h e r w c s i c s e u s o p t m h u s n e n t - n - c i \ e p t t r t o a f f / s e s l s l v p s s r / / o a / m u i v * b u a i e . p o i c s d l t d e n s m r e a c / r s o a / r b / w v r t b l n w i / h i e g w s c n / i . o o g / a n c r n d c p x o / f o p n c . m . s f o d p c i n / o o t f s s n e . u e f s d p r - / e e s r n u v a p i b e s l r o e v r d i d / s . o c r o d n . f c " o ] n f s n e e r a t t v p w r i p b c r e n l o a e c : u o e n o e a r e x e i c d n s v l t - b - # - - - - # - - - - # - - - - - - - # - k f t s l o o t t _ u w e s i e : d n c a a f . m t l " H " " " " H " " " " S " " " " " " " A " : k r : t k i r i e e r r s t T t t t t T t t t t e t t t t t t t p t - n e e n t l n s s p k a : r T r r r r T r r r r c r r r r r r r p r n a x r e : e v : t u s e a P a a a a P a a a a u a a a a a a a l a e l t f r : . o b : f e e e e e S e e e e r e e e e e e e y e t : : i _ u e r l i f r f f f f f f f f i f f f f f f f f w l n n x a i k i o i i i i r i i i i t i i i i i i i m i o t . e a l t g c - k u k k k k o k k k k y k k k k k k k i k r r : m e e e / n . t . . . . u . . . . . . . . . . . d . k u e s r : a e e e h h h h t h h h h h h h h h h h h d h : e D : s n / s t n r t t t t e t t t t e t t t t t t t l t o - a v s w a t t t t r t t t t a t t t t t t t e t c t s l a e o b ( p p p p p p p p d p p p p p p p w p k e t r t r l r . . . . . . . . e . . . . . . . a . e i o / s k e e r r r m r r r s r m m m m m m m r r r _ p w : = d o o o i o o o e s i i i i i i i e o f v p w / t i u u u d u u u r d d d d d d d s u i i e w r r t t t d t t t v d d d d d d d t l e d / a u e e e e l e e e i l l l l l l l e e w s r e c r r r e r r r c e e e e e e e r . e t " t s s s w s s s e w w w w w w w s p r w s . . . a . . . s a a a a a a a . r _ r w a a a r a a a . r r r r r r r a o a a w t p p p e p p p a e e e e e e e p d p g / o p p p s p p p p s s s s s s s p . p e p - - - . . . . p . . . . . . . . t u H i i i h r e t . a a a a a a a m r b T n n n t u n l l p p p p p p p i a l T s s s t l t s o p p p p p p p d e i P e e e p e r . a - - - - - - - d f c S c c c s = y c d h h h h h h h l i / ) u u u - H p e b e e e e e e e e k a r r r r o o r a a a a a a a a w s e e e e s i t l d d d d d d d a s . . . d t n r a e e e e e e e r e r e m i ( t e n r r r r r r r e t u n i r ` s s c s s s s s s s s s l t d e x = o e . . . . . . . = e r d c x w l r h h h h h h h a = y l t x e v . e e e e e e e p H p e . . b e s a a a a a a a p o o w r y s r e d d d d d d d - s i a e y e = r e e e e e e e h t n r d y c m v r r r r r r r e ( t e i . u y e s s s s s s s a ` s s r z r r r . . . . . . . d x = = e z e e . f c b r s s s e x w h c z " s p r o r e t t t r x e t t ` o o a n o f s s s s . b t s ) l r m t w e S I P " y " p c " v t e e s r e n r y s h e = D n e r c c e y - e r 8 e t r e o l l . r m " 0 n T X r n u o z e e " y y s P d d a z d . = p s o s e d z i s t e F l = S = ` r c r N i i 3 u t ) e h u o l c 1 b r " c e e s t y 5 d u t m " n e = 3 o e " e i r s 6 m " = f = t 0 a h f t r 0 i t = r i 0 n t t u c " s p r e t = s u " - t " e o r " r u i e g " i n - w h e n - c r o s s - o r i g i n " # A A A A # D # D # S C # L # M # P P P P O B E A O A A P P P P D M D _ S S C L G M I O p _ _ _ _ o A a C e S H o _ a L t p E D K U m I t O s I E g C i _ h l N E E R a N a N s O _ g H l M e i V B Y L i = b N i N D i A A r c = U = = n x a E o _ R n N ( I a p G h x s C n D I g N i L L t r = t C x e T R V E f E a i o f t o . I a I E L R r o d a p n y O n V R = n = a n u l s f y N d E = s e s v c s : i y = R f t e m e E t e / g . s C = i a d t l n i / u z q a f l c e p v o x r z l c i e k d c i n x a z i h l ) o r x t t e e n o . i e f n y o i m y n g e y u n . ( r t z u a z s t z e i d o n i s n a d s o c n k e e e r d - e c d o m p o s e l a b e l s ) # e # i f # e e e e e e e e e r # e # e i f e # e m m m m # e c # e i f # e d # e s # e i f # e d # e d d d # e i e f e e e e e e e e e e e e e e e e e e e ! c f i c c c c c c c c c e x c f i c c k k k k c p c f i c o c l c f i c o c o o o c f l i c c c c c c c c c c c c c c c c c c c / h . 設 h h h h h h h h h a . p t h h 必 h d d d d ま h D h コ h c 起 h e ア h 権 h c 設 h c c c ア h s h h h h h h h h h h h h h h h h h h h b o e [ 定 o o o o o o o o o d e o r o ! o 要 o i i i i ず o . o o ! ン o k 動 o e プ o d 限 o k 定 o k k k プ o d e o o o o o o o o o o o o o o o o o o o i n e c # e d # A s r e の n r a e e e e e e な r r r r . e c e d テ e 確 p リ o e d を e キ e e e リ o e e e n " v ! c p c o P e m c 確 " " " " " " " " " - v t e " d c c c c c x " デ " e " n k " d c o ナ " r 認 " ケ " c c o 設 " r ャ " r r r ケ " c c c c " " " " " " " " " " " " " " " " " " " / = . h ア h c 生 P d h 認 " ⚠ " N w " p フ f C o h h h h h i ✅ ィ C - - - - n C v e B o h c を S W 1 ー C k h c 定 S ッ C ー C k h h h " ✅ " A ( " T " T " T " 📝 b = e - o . プ o k 成 _ a o ️ o i ァ $ i h c o o o o o t レ r p p p p v o . r u c o k 起 t c a 5 シ h e o k e c シ l c c c シ h e o o o p a o o o a = x f e リ e - p p し K - p t t " イ ( k e k t ク e フ p e イ i k e 動 a o i ョ e r e t o ュ e o o o ョ e r S p s d d C N 1 2 3 s t " n ケ " r w h h た E i p " 1 2 3 e h P ル c - c e " " " " " 1 r ト a s s s b ァ y x メ l e " r r m t ン c " r t m を a m m m ン c " " " e l s s o v o c h e . . . h T e . C v ー G p p キ Y . _ A I . . . : r を a n k r ❌ P " I a リ t t t t o イ i t ー d r ❌ t p i キ k c G i p ク r p p p の k c ✅ ❌ t i u t c i c h e x E r e r . シ e r $ : ー = b k p M t e ロ t e i l f e を i o o o o ル n e ジ i c i o n ー i o e c n o リ i o o o 状 i o u c m o k e k e c t E U E I n n e e ョ n u ( v 8 a を $ a e p P D A A T h s ー t n n E e d f 作 n r r r t を g r を n c D o n s g が n m n o g s ア n s s s 態 n m A A d p a i p e w e c k d p n a v a x ン e n p a . r . ( k y l O O P S h e s ド . w g e r a y o i 成 g a a a s コ n ビ g o o m g e 設 g p e m e g e e e 確 g p p p o t n r r k s i d s C l . t t キ r w r 2 t e c . i R M P S i e o t r s o c k g g g t ピ e a ル m c p f 定 o r p p 認 o p p c c i g t l y t t a u o フ e i e ー a d / - i n a " t c T A _ E s ' E n r i w o e u k - n e e e r ー n l ド D p k o c - o さ a s a o e - c - - - a s l l k o o h c o c T o e t r m ァ x n r を t - ) w c s v t s m a A I U T t n v k f o r e n e / / / a v （ o o e s o f r れ n e t s r f o f f f p e i i e m n y e o g o r u p . e e p イ t g n 生 i r : w l a . / p t N N R _ s r t . が r : e n r e c a f l p i . キ c s r e n て d i e m n p c c r p o m s m a r s e a ル e a 成 n m / w i n e a A i T = L U e a e e 存 t k n e t e p r o / r e ー k e t d s い - n i d f d d d l - a a l s u a p , p e : n d D r が r . l g x p P . o : y = R t e r x 在 r t s e n w s p a g c o n 生 e b - a o e な g f g - s o i o o o i f t t c e h r p o o f T " v o N a 存 n e . \ a \ \ k t p P e n o h L u f t す a l r u d e o s / m s a n v 成 r - u f i c r い e f s c g c c c c i i o t o p s r s i r . c S t 在 a n e a r e e _ _ n P u t = p i t e る e s a r t r a p e c m な f i n k v 場 n d n i k u k k k a d o o m e u e l e u e k a e k i し l v x p / y r k K v k l r t h k o r か f e e t w k r u w h e し i l d e e i 合 e o e d o e r e e e t o n n p ! l x i n e x e i v な . a p w : n e E . e e - p t a - n 確 i | f o o y b o e n の m d d o r r c は r c w o n r a r r r i c o " d t c - : - r f t r s e い ] e m l w g a y Y e y a d s t s n c a 認 k i y r f l r t D a o c s - e 生 a k c s - t - - - o k c c s e a f " f o i e - 場 ; x p i w e l . = x s o : p s e o l - g k o c k o d i k o g c f k . c s 成 t e a k . c i c c c n e o o e b r t u k r c p V 合 t l c n に t / t g e m / s u t n n r - u r u i c / f c e k a e . o i r p e . o o o o o r n n e n i d d t n o r i は t e e a \ e 設 m A e e a / : m w t | e e n r e c n r { i k s e i r . m t n - p r . m n m m m s - t t - a o o o i d a m o e 作 h r t r 定 p P r n e i y e o i t p e a r d e c l e . r l - " p o g c l - " p p p p t c a a f a l n c c n a l p p w 成 e n . i a ) P n e d n / s r n g w t e t e ! c a e r . - e c o o i c o c o o o a o i i v , k k g s o e e n a e o t _ a r i . u y k u r o - w x e a " t c . f . c d o s b a m c o s a s s s t m n n d a T e e h w s r r l n n e K l a t c r o y ' e e r q o t t o h . i " o . m e e p p a m e c e e e u p e e o i r r r r ( b i e l v E . t o - u o p k r e t e r e . l m p - p o t p - h - - - s o r r c l a u - - i o t - y S f . k Y b e . m d r u a w t k r h i , " e p T o e r l s i o e e e e e . s k a e n c c f a h e e i e e - = a d e o - l i e r n e t e s を o r s x e i e o s x . x x x . e i m e b f : o o r x c t l x y e b k n ( m d h r t x a n a r s e 使 s y e t a c - n e t . t t t . - s a r l i " m m d d y t o u e t . n a s v y a o a e h i e o l n a . s 用 e i - e d a e - e . e e e " e y - e k p p a o e n p . e . v s u . o i m v a s f t e e . s ） - n e r y t x k e r " r r r x r c o o s f u r f . r . = e c e u n a e d t ^ t i T t f . i e g x n . i t e x n n n n t u h o a i s s h o r n i w . n " p 6 c x r . i y h # s k f r w i " o x t a . o e y t a a a a e n a m t s e e b r a g i " a r 4 e t c n a e ' . - o a o k n t w e l . n r . e l l l l r n v p - - o a l u t l o : s e a o . n c . n u e r - s e i r . " n . r . . . . n i e o y p e e a t c . r h d $ s r c m c r c | . e n f k n , r t n y k a . n y y y y a n s o r x x r h t y e u A f n t o e e u " t d i e v n h a m e l " a m m m m l g i e u o t t d e u m d E c P u a u ( m x a r x w ! k m t i a o l l y . l l l l l . ! s - r p e e a l x t P l l a w t t r a o " a w e l u . y . y " s e e r r i n l f t i _ l l i ( e e e r r i n o w . t y u i m y e e e e m u x c r n n s e T o e o K y a t f r d n g k s u r s y m p f l m x x x x l e t o l a a w d r r r n E ! n d h o n . t s ; a k } m c l l e e e e s e n y l l a o a n Y " d o r a " ) r l " l a - n e c c c c p . r f . . c r m e y a / m H l s t u l c b d e x e s n i c y y c o a f o l - " c a T p e h n y b h u e e x a a a a C a g o m m e u i i u s o i T r T t e n : u e i d c e p p p p | h l u n l l s t n k r T h . n n P o r t n i " i . l e c p p p p e . r f s e r o e f ) S p a i n l . d d a g c y e i d l i s s l d a w n i " ) e e n g d . . p a c p p p r k m d g o o b " e a o e v g " r f g ; " . p p h h h h e l u w g l t b m f | . u i s w - . p o p p p p l d r n s e t e a i e r a k . i t n " p w o l o e " ) i l i k s x e s . t h o h p n a a a - g o m d - : n s n e t s i . h e - p h r r r q s g a f " g " = d e t e n " n c p - t t t : s i a s w = r h t s t a a R i i i " " n n a " i = ' n e t r c r a s s s U a d p t " s a l a a h t r w a a a p p ( p h / l f o n e e i t w n n n " p H S " b o a c f s i w ; " T S y a l d e i a s - c c r T L o s l i k n a d o o o t P u e o n r - n a n n u h S c r 6 w g u n k t f f t e ) e 4 i ) n e e k a i i e n " r d : n " n t y e : g g : t o / g i w : y w : : c i m / : n o g : w c c l f a ' " g r e g w l a e i i " k n e - e c a c n > e n d a h r a " c r e a r e t a r a r t e p e t a a s p a e t _ t e a k e v r e d - a e y . s - r . " h f / s t o o w e m w r w t p c w | e / u s p g t ) r o " e r p a g - e q " v b a a r s / e w 6 w 4 w : / " b ; o o t t h s e t n r a p / c a c h e e c h o " P e r m i s s i o n s e t t i n g c o m p l e t e d " まとめ 間違っている点もあるかもしれませんが、参考になりましたら幸いです。 ...

概要 Annotorious v2のpolygonツールを使って、polylineを作成する方法の備忘録です。 背景 Annotorious v2のウェブサイトは以下です。 https://annotorious.github.io/getting-started/ 以下のように、polygonを記述することができます。 一方、同様の方法でpolylineを記述するツールは、以下のプラグインを含めて、提供されていないようでした。 https://github.com/annotorious/annotorious-v2-selector-pack カスタマイズ 以下のような多角形を作成した場合、 以下のようなJSONファイルが作成されます。 { } " " ] " } " " t b , t , @ i y o a c d p d r o " e y { } g " " } n : " " e s s t : : t o e e " " u l x # " [ " " " : r e " " t c A t v p c c t v " 4 n y a u { e t y a : 6 n p l r " o p l 9 o e u p : r e u " b t " e o " " e h 1 a : " s " : : " t a t : e h : t 3 i " " t { " p - o T " : t S " : 8 n e p p v < / 9 " x o " s g s / 0 , t l c : S v w 2 u y o / e g w - a g m / l > w 4 l o m w e < . 4 B n e w c p w 4 o " n w t o 3 3 d , t . o l . - y i e r y o 8 " n - " g r f , g c , o g 5 " o n / 4 d n - i p s 4 c o / 7 e i a d s n n f . t n 8 u s o b n = . b i \ j 8 f " s 7 r 3 o d . 3 n 7 c 8 l e h 3 d " / . " l 1 , o 2 r 1 i 3 s 3 / 7 g 8 a 9 u 0 / 6 g 2 a 5 u , - 1 F 2 r 9 a 0 g . m 1 e 3 n 7 t 4 / 5 g 1 a 1 u 7 - 1 F 8 r 7 a 5 g m 9 e 4 n 5 t . _ 1 f 3 r 5 a 4 g 9 0 8 0 0 1 4 a 6 . 8 j 7 p 5 2 , / 1 f 6 u 5 l 8 l . / 4 f 2 u 6 l 5 l 1 / 3 0 6 / 7 d 1 e 8 f 7 a 5 u l 8 t 8 / 5 j . p 9 g 6 " 9 , 6 6 5 5 2 7 3 4 3 8 , 3 0 0 3 . 3 5 2 2 9 4 9 2 1 8 7 5 2 5 0 8 . 5 4 1 5 0 3 9 0 6 2 5 , 3 3 4 8 . 4 2 4 0 7 2 2 6 5 6 2 5 3 4 8 5 . 0 2 1 4 8 4 3 7 5 , 2 7 2 4 . 3 5 7 9 1 0 1 5 6 2 5 2 1 7 0 . 8 1 1 7 6 7 5 7 8 1 2 5 , 2 1 0 7 . 6 3 3 7 8 9 0 6 2 5 \ " / s v g > " 上記に対して、autoCloseのような変数を用意し、これがfalseの場合、polygonという文字列をpolylineに変更する処理を加えました。 ...

概要 Editor.jsでインラインのマーカーツールを作成する方法の備忘録です。 参考 以下のページが参考になりました。 https://editorjs.io/creating-an-inline-tool/ https://note.com/eveningmoon_lab/n/n638b9541c47c TypeScriptでの記述にあたっては、以下が参考になりました。 https://github.com/codex-team/editor.js/issues/900 実装 Nuxtで実装します。以下のmarker.tsを作成します。 i c } e m l x p a b s a t c s } s } c } r } s } w } u } c } p o s u t p a l t t o e u r n h o r s t a i g a a r } a r n t t t t t n t t t t r r i } t a c c m m r t w c c m r e c t i } } r t t t : : s 静 t e ; イ t e s h h h h h ボ d h h h h e 選 r f h テ p o o a a a h < r o o a a ツ c o h f t M o e s 的 i t m } ン i t t i i i i i タ e i i i i t 択 o t r i キ ( n n r r n i m a n n r n ー k n i t e t t a n : A s : メ c u a , ラ c u r s s s s s ン r s s s < s u さ u ( h e s ス r s s k k g s a p s s k g ル S s s ( h l h d y r : P t ソ r r c イ r u . . . . . 要 ( . . . s . r れ n t i t . ト a t t . . e . r ( t t ? e の t t . t i s i e p k b I r s ッ g n k l ン g n c a b s t c 素 ) b b b v b n た d h s u w を n c a . a k r . . 状 a s h s e s f e e n o ; i t ド e : a ツ e t p u t a l を u u u g u テ ( i . r r g s m l p i p > a m t r i 態 t m t i . . a r u o n r で t { s ー t t o i t a g a 作 { t t t t t キ r s u n a < e e a a p n i n a e e n を e a a s b { b u { T l l g i 許 { s ル r r t t s 成 t t t w t h ス a . n ; p m : l r s e s . タ g r x m s チ ( r t . u u l o l e ; n 可 s : と i u ( = o e = s し o o o i o i ト n s w ( a e k s n e s グ e k t o e ェ ) k e s t t t A o a g さ a し s e { n 、 n n n d n s を g t r r r R c N d r e を : v r ッ t t t P l | n ; れ n " て I ; a = " = S . . t . . e a a a k a t = a C t l 解 = = e t ク { = = a o o M I ; る i c の n a p = M V = t i h c b < : t p n > n e m h N e 除 R ( N t n n a { H H t d 振 l p i f A " G y n = l u m e ( g g d d e i o c a t r ) o t ! e ? ? r } T T i x る i i ; n a R c ア d p n " a t a R ) r e タ e T o l d t n h a ; d h ! ) . . k M M z - 舞 n u l K d イ o e e 2 s t r a a ) グ ) e c = d e i g i n e i m c c e f L L e m い e } l s " x コ c r 0 s o k n { n ; で x u ( ( o e s g ( s a { l l r r B タ ( a を ( : l e ; - ン u = H " L n > g g ラ { t m t s m n ) . e t . r a a T o u グ ) r 定 ) ; ; m を m T i ; e e ッ e h e a . a . e a k s s o m t と k 義 { a 設 e " M h s タ ) ) プ = n i l r e { p e x p ; s s o t 属 { e { r 定 n b L e t グ ; t s e k x i x t i L L l " o 性 r a k t u i . で { r . . c ) p . t ) . i i ; @ n を " p e . t = g a 囲 a c c t ; a s r ; s s s e E 指 , i r c t h d む n r l e n e a e t t d l 定 : " r o t d g e a d d l c l . . i e ; e n = ( e a s T T e t e a r t m A a " " t . t s e o c C c d e o e P t ; 1 h e e ; x T t o t d m r n I e 8 i x E t a i n i ( o j t E " s t l ) g o t o " v s ; } l > . r e ; ( n e n c e / ) e < a a m m . n . d ( e m p p c e c a f t f x " d { e a i t n l r i s i - c i n t . C t a k n ( n m d t t h s o ( s ) d ) d a x o ( t n t s ; P ; P r - r " d y t h a a k m j b = l e i 属 r r e a s u " e n s 性 e e r r " t M s t . の n n - k ; t 1 . s t 追 t t - e o 0 i ( a 加 T T a r n . n ) g a a c - " 4 l ; ) g g t - ) 5 i ; ( ( i a ; 8 n t t v c e h h e t 1 T i i " i 2 o s s ) v . o . . ; e 0 l t t " 4 B a a ) l u g g ; 2 t ) , . t ; 9 o t 1 n h 9 ) i ; s 1 . . c 6 l 8 a 6 s s . ) 7 ; 8 1 1 . 4 1 7 . 9 8 4 . 0 3 . 9 7 4 1 . 6 8 7 H 8 . 6 7 4 l 1 . 4 9 - 2 . 5 8 3 . 5 0 8 . 7 7 5 . 8 0 2 - 1 . 4 0 1 z m . 5 4 6 . 9 5 2 l 3 . 6 2 4 - 6 . 3 2 7 a 1 . 5 9 7 1 . 5 9 7 0 0 1 2 . 1 8 2 . 5 9 1 . 6 3 2 1 . 6 3 2 0 0 1 . 6 1 5 2 . 2 0 1 l - 3 . 5 1 9 6 . 3 9 1 - 2 . 9 0 2 - 1 . 6 7 5 z m - 7 . 7 3 3 . 4 6 7 h 3 . 4 6 5 a 1 . 1 2 3 1 . 1 2 3 0 1 1 0 2 . 2 4 7 H 3 . 2 7 3 a 1 . 1 2 3 1 . 1 2 3 0 1 1 0 - 2 . 2 4 7 z " / > < / s v g > ' ; 上記を以下のように呼び出します。 ...

概要 Editor.jsを使用する際、デフォルトでは左右に大きなマージンができます。これを解決する方法を紹介します。 方法 以下が参考になりました。 https://github.com/codex-team/editor.js/issues/1328 具体的には、以下を追加します。 . . } . } c c c e e m d m - - a x a b t x - x l o - b - o o w l w c l i o i k b d c d _ a t k t _ r h h c _ : { : o _ n c c 1 t o a 0 e n l 0 n t c % t e ( , n 1 ! t 0 i 0 m { % p o - r t 8 a 0 n p t x ; ) ! i m p o r t a n t ; ソースコード全体は以下です。 ...

概要 以下の記事で、Nuxt 3でLeaflet Marker Clusterを試す方法を紹介しました。今回は、Composition APIを使った書き方に更新したので、その備忘録です。 インストール 以下をインストールします。 n n p p m m i i l - e D a f @ l t e y t p e l s e / a l f e l a e f t l . e m t a r @ k t e y r p c e l s u / s l t e e a r f l @ e v t u . e m - a l r e k a e f r l c e l t u / s v t u e e r - l e a f l e t ソースコード 以下を参考にしてください。 ...

概要 Nuxt3とVuetifyを使用したサンプルリポジトリに、Cytoscapeの動作デモを追加しました。 https://github.com/nakamura196/nuxt3-demo 以下のページで動作確認いただけます。 https://nakamura196.github.io/nuxt3-demo/ インストール 以下を実行しました。 n n p p m m i i c @ y t t y o p s e c s a / p c e y t o s c a p e ソースコード < t e < i l c c } o } < # } m / s m e o o ; n ) / s c / p < t c p t n n c ] M c } ; s t y w h p b s l d / e r o s s y ) o y ) c y i e o a t a i < d m i r c t t . { } { } ; u c b a s e } l } ; r l { d i s c y t v d i p p t y a , , n = o o u t l , a , i e t g i k l e - i v l t : c a d g d p g d t n x t y . . . } . . } e n ] e ] y n d p p h h t g e > i b v > a c o d d r a o r a e c t S o l s s c ) s c ) m o , d , o a i a t s : t i r > d t t s y a u d ( o t s o t d y a e u e t e s h w " " " " c " e s w " " " " , e d { { { { { { { { g { { { { { { { u m r d > c : o o = n i e e t n n N [ u a i u a ( t i l n : y l s e i b b b b o t l s i t l t c n e e t e e d o 1 n u " d > t o y t o p : t p : ( o n e s l e ( i d a o o o n e e ( d a i a u t s d d d d d d d d s d d d d d d d : : c i p 0 8 : n v c = u s : d : i : ) s e c e c e c { g t c r r r t x c { t r n r r s : a a a a a a a a : a a a a a a a t n e 0 0 d i l " p c = e { o { c r t l y s t h h k d d d e t t h g e g v : t t t t t t t t t t t t t t t { " e g d % % a - e a c a n " n " = a : i e t h o t : g e e e n - o : e - e e [ a a a a a a a a [ a a a a a a a b d : > ; ; b c w s y l p n u = n i : e i > p o c o e r : r r r r t v r t c t - { : : : : : : : : : : : : : : : r : s o " s " a e u m o d d d e d n t s e ( 8 o - - - : a ( 6 - o - s e 1 o l > = > n l b d : { g : { ( o E i c t " 8 0 u c w o l " , a l a t { { { { { { { { { { { { { { { a t 0 l o " < g f l e e e { c n f a ( n 0 , n o i p " i e r o r y d r , u r m / = r ; r s " x s " u a y p ) o , d l d a d g d r r r l i i i i i i i i s s s s s s s t u t : a d " o = " n : " e m b : e d - o t c a n g o " o e d d d d d d d d o o o o o o o h e e - i t m = > , o , d e l e f r h i t " e w : w " : : : : : : : : u u u u u u u f , ; l 4 v s d 3 g n e t " i " " t a : " - - : r r r r r r r i i " > " " 0 { e 0 e t d r ) t : : y ( ) s " c " " " " " " " " c c c c c c c r g > c = ; " 0 " . : u " " n " h # o " c b l a r g p w e e e e e e e s h c y , g e : " 3 : a c a f l b a i a p o r l h : : : : : : : t t o t r + + e f , # , m e p f o e t r d h s a a e " c l o e y t a " 0 0 e n e a r z " d y i e s n a " " " " " " " , y o s f c : c E l c 0 . ) t " a " i " b d " s t t c b b g g l a a r c ( = o o l s o 0 5 " e : a : e } u " h " " a i i r r a p n = a n u 2 u e e v " , , r a r } g } o t r r a a d h ; " p u r n 0 n m , e , " " " " " } " } p } } " d d s s y i p e l e t 0 t e r , t , # , , } } p , " " s s b d r " l f , n " r f , } } , e } } , , h h u " i ; ) ( } } t , i f , r , , t o o g , m ; 0 , , s B a a } " a t t p p " a ) o y n a , r a a p p , t r ; u I g a } g r r e e a y / r d l a e g g r r t r " r c ( e " } t e e " " a g e / e " " , , : t t , , r e a r : c , : : g t c e y " t t e : o t a " " b " " a a t n i c n ) i l g r r : " : v t o , r a r g g r c e i d d d a e e " o l ( v e " y s t t a s i { e " b s : : p e c } ( } u h h " k ) 0 + g o " " i = ; ) } " p p w d } " ; c , p l h " a o } e a e } d / u r n a } , d : n } " t t N t , " " } o a , } , d n } } e y t } " a , } } > r , , p g u e s t h : < / " v c - a b t t " n > } , まとめ 参考になりましたら幸いです。 ...

Splitpanesは、以下のように、ペイン（pane）分割・リサイズを可能にするVue.jsのライブラリです。 https://github.com/antoniandre/splitpanes このライブラリの利用にあたり、ペインにiframe要素を含む際、リサイズがうまくできないことがありました。これに対して、以下で対応方法が記載されていました。 https://github.com/antoniandre/splitpanes/pull/162 上記に記載がある通り、以下を追記することで、iframe要素を含むペインがあっても、正しくリサイズ操作を行うことができました。 . } s p l i p t o p i a n n t e e s r - - - e d v r e a n g t g s i : n g n o . n s e p ; l i t p a n e s _ _ p a n e { 同様のことでお困りの方の参考になりましたら幸いです。 ...

概要 Nuxt3（Vue3）を用いたテキストの選択機能の実装にあたり、VueUseを使用してみましたので、その備忘録です。 https://vueuse.org/ デモ 以下のページからお試しいただけます。 https://nuxt3-demo-git-main-nakamura196.vercel.app/textSelection ソースコードは以下です。 https://github.com/nakamura196/nuxt3-demo/blob/main/pages/textSelection.vue インストール方法 以下のページに記載があります。 https://vueuse.org/guide/ 具体的な手順は、以下のとおりです。 n p m i - D @ v u e u s e / n u x t @ v u e u s e / c o r e e } x ) p m ] n o o , u r d ' x t u @ t l v . d e u c e s e o f : u n a s f u [ e i l / g t n . u t d x s e t f ' i , n e N u x t C o n f i g ( { まとめ テキスト選択以外にも、便利な機能が色々と使えるようなので、引き続き試してみたいと思います。 ...

概要 Omeka SおよびOmeka Classicは、デジタルアーカイブ構築および人文（情報）学研究において、とても便利なツールです。 https://omeka.org/ REST APIを標準搭載し、モジュールおよびプラグインの追加などによる高い拡張性を持ちます。またIIIF関連ツール、翻刻支援ツール、時空間情報を取り扱うツールなど、さまざまな既存資産を利用することができます。 一方、サイトの見た目を変更するテーマ開発などについては、PHPおよびOmekaに対する知識が求められ、比較的難易度が高いと（個人的に）感じています。この点について、昨今はバックエンドとフロンドエンドを分離したHeadless CMSという使い方も普及しつつあります。 そこでOmeka ClassicをHeadless CMSとして使用し、Nuxt 3を用いたフロントエンド開発を試みました。Omekaの活用方法の一例として参考になれば幸いです。 Omeka Classicの準備 APIの有効化 以下を参考に、APIの有効化を行います。 https://omeka.org/classic/docs/Admin/Settings/API_Settings/ Access-Control-Allow-Originヘッダーの追加 .htaccessファイルにAccess-Control-Allow-Originヘッダーを追加します。 H # # # # e a O T E d m h r e e i r r k s o a r s f e . i R t h l e t e p A a o c c i r c c s t e e i s s r n s s e g - : q C u # # o A i n p r t a e r c d o h l e f - o A c r l o l n O o f m w i e - g k O u a r r i a t g t o i i n o f n u " n * f c " i t l i # e o n 追 加 c o r r e c t l y . Omeka ClassicのAPI 以下のページにAPIがまとめられています。 ...

LeafletのVue3での使用例（座標範囲の取得を含む）を紹介するリポジトリを作成しました。 以下が動作例です。 https://static.ldas.jp/vue3-leaflet/ ソースコードは以下です。 https://github.com/ldasjp8/vue3-leaflet Vue3初学者のため、誤りなどがあるかもしれませんが、参考になりましたら幸いです。

Vue3でOpenSeadragonを使用するサンプルリポジトリを作成しました。 以下が動作例です。 https://static.ldas.jp/vue3-osd/ ソースコードは以下です。 https://github.com/ldasjp8/vue3-osd Vue3初学者のため、誤りなどがあるかもしれませんが、参考になりましたら幸いです。

以下が参考になりました。 https://stackoverflow.com/questions/59407003/set-focus-text-field-inside-dialog-when-dialog-opened 以下のように、ダイアログを開いてから少し時間を置いてから、$refsにアクセスするとうまくいきました。 w } a t c d } h i : a } l i { o f } g s , : e v t t 2 f a T h 0 u l i i 0 n u m s ) c e e . ; t ) o $ i u r o { t e n ( f ( ( s v ) . a n l = a u > m e e ) { . f { o c u s ( ) ;

概要 カレンダー形式で情報を表示するウェブアプリケーションを作成しました。以下、はてなブログの記事の一覧を対象にした表示例です。 https://static.ldas.jp/calendar/?u=https://nakamura196.github.io/json/calendar.json https://github.com/ldasjp8/calendar 以下にアクセスして、「例」ボタン、「追加」ボタンをクリックすることで、表示例をご確認いただけます。 https://static.ldas.jp/calendar/ 以下のような形式のjsonファイルのURLを引数に指定します。 https://nakamura196.github.io/json/calendar.json 以下、jsonファイルの作成方法の一例として、Excelファイルからの作成方法について説明します。 jsonファイルの作成方法 Excelファイルの作成 以下に示すようなExcelファイルを作成します。「metadata」と「items」の2つのシートを用意します。 https://docs.google.com/spreadsheets/d/14myDqZTxocwOT0Mw3ZzKLO81E6r15R-49oUh2dG9Rbo/edit?usp=sharing シート「metadata」 本シートには、A列に示す「description」「header」「footer」「link」を用意します。以下の画面に対応します。 「link」については、B列「literal」が表示文字列、C列「uri」がURLです。複数行を入力可能です。 シート「items」 本シートの以下の列が、予約済みの項目です。collectionsとdateは検索フォームに使用されます。 collections date label thumbnail url description G列以降の「Updated」などは、任意の項目です。 上記の項目は、以下のように対応します。なお、セル内に複数の値を入力したい場合には、「|（パイプ）」で区切ってください。 jsonファイルへの変換 以下のGoogle Colabを利用して、用意したExcelファイルをアップロードして、jsonファイルに変換します。 https://colab.research.google.com/drive/1aJKbJjK9Gu4SwDp6IfGCHNuhTH3pJ3hp 上記プログラムの実行後、ダウンロードされたJSONファイルをGitHub PagesやGist、レンタルサーバ等にアップロードし、そのURLを以下のカレンダー表示アプリに入力してください。 https://static.ldas.jp/calendar/ （参考）はてなブログの記事を対象とした利用例 はてなブログの記事を対象とした利用例として、はてなブログのAtomPub APIを用いて、上述したExcelファイルを生成するプログラムを作成しました。以下の記事を参考にしてください。