Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
diva.js: A web-based document viewer for high-resolution images
Search
Wendy Liu
July 28, 2012
Programming
0
330
diva.js: A web-based document viewer for high-resolution images
Presented at the SIMSSA workshop held at McGill University.
Wendy Liu
July 28, 2012
Tweet
Share
More Decks by Wendy Liu
See All by Wendy Liu
Git and Github: Version control for a happier you
dellsystem
0
300
Optimising your JavaScript
dellsystem
1
490
Git and Github: Tips and tricks
dellsystem
2
370
Git and Github: version control for the 21st century
dellsystem
1
270
Django: The web framework for perfectionists with deadlines
dellsystem
0
340
Git and GitHub: an introduction
dellsystem
2
230
What's in a name? Using first names as features for gender inference in Twitter
dellsystem
1
360
Other Decks in Programming
See All in Programming
効率化に挑戦してみたらモバイル開発が少し快適になった話
ryunakayama
0
140
大規模Reactアプリのリアーキテクチャ~8万行のTanStack Query移行の軌跡~
kj455
4
1k
Apache Hive 4 on Treasure Data
ryukobayashi
1
420
MetricKitで予期せぬ終了を検知する話 / Detect unexpected termination with MetricKit
nekowen
1
200
デフォルトにして至高、RubyMineの大好きな所
ruzia
0
820
敵対的ポイフル
futabato
0
130
CA.swift19 恋するAIアプリ開発の裏側
oskmr
0
380
『Railsオワコン』と言われる時代に、なぜブルーモ証券はRailsを選ぶのか
free_world21
1
360
Goのエラースタックトレースの歴史と今後
sonatard
10
1.8k
DMMプラットフォームがTiDB Cloudを採用した背景
pospome
9
4.2k
Site Reliability Engineering for GMO
pyama86
8
1.1k
Build Apps for iOS, Android & Desktop in 100% Kotlin With Compose Multiplatform (mDevCamp 2024)
zsmb
0
440
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
358
22k
Scaling GitHub
holman
457
140k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
323
20k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
352
28k
Designing Experiences People Love
moore
136
23k
Building Adaptive Systems
keathley
32
1.9k
The Brand Is Dead. Long Live the Brand.
mthomps
49
29k
From Idea to $5000 a Month in 5 Months
shpigford
378
45k
The Power of CSS Pseudo Elements
geoffreycrofte
62
5k
Building Applications with DynamoDB
mza
88
5.6k
The Illustrated Children's Guide to Kubernetes
chrisshort
32
46k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
21
1.9k
Transcript
A web-based document viewer for high-resolution images A web-based document
viewer for high-resolution images Wendy Liu Wendy Liu 1 / 41
Outline Outline 2 / 41 What it is What it
is How it works How it works Image manipulation features Image manipulation features
What it is What it is 3 / 41
Manuscript: Salzinnes Antiphonal Manuscript: Salzinnes Antiphonal 4 / 41
High resolution High resolution 5 / 41
Preserve document structure (scrolling) Preserve document structure (scrolling) 6 /
41
7 / 41 Fast and easy to use Fast and
easy to use
8 / 41 Free tool Free tool
9 / 41
10 / 41 Distribution? Distribution?
10 / 41 TIFF, ~30 megapixels (~180 MB) per photo
TIFF, ~30 megapixels (~180 MB) per photo TIFF, ~30 megapixels (~180 MB) per photo TIFF, ~30 megapixels (~180 MB) per photo
12 / 41 180 MB × 479 images ≈ 86
GB 180 MB × 479 images ≈ 86 GB
13 / 41 Enter Diva.js Enter Diva.js
14 / 41 From manuscript ... From manuscript ...
15 / 41 To browser-based document viewer. To browser-based document
viewer.
16 / 41 Zooming in and out Zooming in and
out
17 / 41 Grid view Grid view
18 / 41 Image manipulation Image manipulation
19 / 41 Extremely fast Extremely fast
20 / 41 Selective downloading Selective downloading
21 / 41 How it works How it works
22 / 41 Tiled images (JPEG2000 or pyramidal TIFF) Tiled
images (JPEG2000 or pyramidal TIFF)
23 / 41 Multiple resolutions in one file Multiple resolutions
in one file
24 / 41 Image server: IIPImage Image server: IIPImage
25 / 41 Setup frontend scripts Setup frontend scripts
26 / 41 Demo Demo http://coltrane.music.mcgill.ca/salzinnes/experiments/diva-cci-tif/
27 / 41 New feature: plugin system New feature: plugin
system
28 / 41 Download plugin Download plugin
29 / 41 Image manipulation plugin Image manipulation plugin
30 / 41 Canvas: HTML5 feature Canvas: HTML5 feature
31 / 41 Canvas: HTML5 feature Canvas: HTML5 feature
32 / 41
33 / 41
34 / 41 Working with large images: slow. Working with
large images: slow.
35 / 41 More pixels → more operations More pixels
→ more operations
36 / 41 Solution: thumbnail preview. Solution: thumbnail preview.
37 / 41 MIT license MIT license
38 / 41 Download from ddmal.music.mcgill.ca/diva Download from ddmal.music.mcgill.ca/diva
39 / 41 Development coordinated by Development coordinated by Ichiro
Fujinaga (DDMAL) Andrew Hankinson (DDMAL) Laurent Pugin (Swiss RISM) Ichiro Fujinaga (DDMAL) Andrew Hankinson (DDMAL) Laurent Pugin (Swiss RISM)
40 / 41 Sponsored by Sponsored by Swiss National Science
Foundation Swiss National Science Foundation
41 / 41 Thanks. Thanks.