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-r...
Search
Wendy Liu
July 28, 2012
Programming
0
360
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
330
Optimising your JavaScript
dellsystem
1
530
Git and Github: Tips and tricks
dellsystem
2
390
Git and Github: version control for the 21st century
dellsystem
1
300
Django: The web framework for perfectionists with deadlines
dellsystem
0
430
Git and GitHub: an introduction
dellsystem
2
260
What's in a name? Using first names as features for gender inference in Twitter
dellsystem
1
460
Other Decks in Programming
See All in Programming
今だからこそ入門する Server-Sent Events (SSE)
nearme_tech
PRO
1
120
個人軟體時代
ethanhuang13
0
320
複雑なドメインに挑む.pdf
yukisakai1225
5
1.1k
Introducing ReActionView: A new ActionView-compatible ERB Engine @ Rails World 2025, Amsterdam
marcoroth
0
670
Cache Me If You Can
ryunen344
2
680
Android 16 × Jetpack Composeで縦書きテキストエディタを作ろう / Vertical Text Editor with Compose on Android 16
cc4966
1
190
為你自己學 Python - 冷知識篇
eddie
1
350
テストカバレッジ100%を10年続けて得られた学びと品質
mottyzzz
2
580
OSS開発者という働き方
andpad
5
1.7k
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
110
「待たせ上手」なスケルトンスクリーン、 そのUXの裏側
teamlab
PRO
0
500
奥深くて厄介な「改行」と仲良くなる20分
oguemon
1
520
Featured
See All Featured
KATA
mclloyd
32
14k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
112
20k
Thoughts on Productivity
jonyablonski
70
4.8k
Done Done
chrislema
185
16k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
A better future with KSS
kneath
239
17k
Building an army of robots
kneath
306
46k
Navigating Team Friction
lara
189
15k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
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.