福島県で胃がんが急増?のグラフを少しでも対話型にするためにSVG化する方法を検討する。SVGについてはこちらを参照されたい。
SVGにすれば,最初のグラフは次のようになる。マウスを乗せるとグラフが赤くなり,少し待つとツールチップ(吹き出し)に都道府県名が現れる。
このSVGは次のようにして作った:
library(readxl)
all = read_excel("pref_AllCancer_mortality(1995-2016).xls", "asr75")
x1 = 1994.8
x2 = 2016.2
y1 = 60
y2 = 128
filename = 'test.svg'
fx = function(x) 30 * (as.numeric(x) - x1) + 52
fy = function(y) 8 * (y2 - as.numeric(y)) + 2
f = function(x) formatC(x, digits=1, format="f", drop0trailing=TRUE)
w = fx(x2) - fx(x1)
h = fy(y1) - fy(y2)
cat('<svg width="', ceiling(fx(x2)+2), '" height="', ceiling(fy(y1)+30), '">\n', sep='', file=filename)
cat('<style>\n text { font-size:16px; font-family:sans-serif; }\n .gr:hover, .gr path:hover { stroke:#ff2800; stroke-width:4; }\n</style>\n', file=filename, append=TRUE)
cat('<rect x="', f(fx(x1)), '" y="', f(fy(y2)), '" width="', f(w), '" height="', f(h), '" stroke="black" fill="none" />\n', sep='', file=filename, append=TRUE)
for (x in seq(1995,2015,5)) {
cat('<path d="M', f(fx(x)), f(fy(y1)), 'l 0 +10" fill="none" stroke="black" stroke-width="1" />\n', file=filename, append=TRUE)
cat('<text x="', f(fx(x)), '" y="', f(fy(y1)+25), '" text-anchor="middle">', x, '</text>\n', sep='', file=filename, append=TRUE)
}
for (y in seq(60,120,10)) {
cat('<path d="M', f(fx(x1)), f(fy(y)), 'l -10 0" fill="none" stroke="black" stroke-width="1" />\n', file=filename, append=TRUE)
cat('<text x="', f(fx(x1)-15), '" y="', f(fy(y)+5), '" text-anchor="end">', y, '</text>\n', sep='', file=filename, append=TRUE)
}
for (i in 2:48) {
cat('<g class="gr">\n<g fill="#66ccff">\n', file=filename, append=TRUE)
for (j in 4:25) {
cat('<rect x="', f(fx(names(all[j]))-2), '" y="', f(fy(all[i,j])-2), '" width="4" height="4" />\n', sep='', file=filename, append=TRUE)
}
cat('</g>\n<path d="M', f(fx(names(all[4]))), f(fy(all[i,4])), 'L', file=filename, append=TRUE)
for (j in 5:25) {
cat('', f(fx(names(all[j]))), f(fy(all[i,j])), file=filename, append=TRUE)
}
cat('" fill="none" stroke="#66ccff" stroke-width="2" />\n', file=filename, append=TRUE)
cat('<title>', as.character(all[i,2]), '</title>\n', sep='', file=filename, append=TRUE)
cat('</g>\n', file=filename, append=TRUE)
}
cat('</svg>\n', file=filename, append=TRUE)