1920 × 1080 作品として見る 版そのものを描画 — どの倍率でも字は潰れません 骨格・余白・カラムを重ねた状態
1920 × 1080 作品として見る 版そのものを描画 — どの倍率でも字は潰れません 骨格・余白・カラムを重ねた状態
コピーして貼るか、ファイルに保存して渡す。ネットにつながらない環境には「全部入り」を 1 つ渡せば足りる。
このパネルの中身を、URL の先にあるファイルの中身まで含めて 1 つにまとめた Markdown — 大きいのでファイルで渡す(コピーは 32KB まで)
以下の仕様でスライドを 1 枚作ってください。 - 版面 1920 × 1080 - 余白 上 100 右 140 下 100 左 140 ## 文字(版面 1920px に対する px) title 46px / 700 / 字間 0.01em subtitle 22px / 500 axisTitle 22px / 700 tick 20px / 500 channel 24px / 700 count 22px / 700 legend 20px / 500 takeaway 28px / 500 note 20px / 400 ## 配色 地 #FFFFFF / 面 #F4F6F9 / 文字 #131820 / 補助 #667183 / 強調 #1F5FA8 / 罫 #DBE1E9 / #1F5FA8 / #A85A2E / #D47A41 / #668CB9 / #1C8C79 ## 外すと崩れる点 - 4窓口×各24件を1点ずつ描き、1点が1件を表す - 横位置は応答時間、縦方向のずらしは点の重なりを避けるためだけに使う - 密集部も外れ値も観測点として残す。平滑化密度や箱ひげ要約で置き換えない - 架空の初回応答記録。窓口間で対象期間・計測の起点を揃える 内容は[ここに自分の内容を書く]に置き換えてください。寸法と配色はそのまま守ってください。 正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/beeswarm-plot-support-response-samples/pattern.html
/ai/designs/beeswarm-plot-support-response-samples.json
format: slide-16x9
density: medium
layout:
kind: axis
canvas:
w: 1920
h: 1080
margin:
top: 100
right: 140
bottom: 100
left: 140
type:
title:
size: 46
weight: 700
tracking: 0.01em
subtitle:
size: 22
weight: 500
axisTitle:
size: 22
weight: 700
tick:
size: 20
weight: 500
channel:
size: 24
weight: 700
count:
size: 22
weight: 700
legend:
size: 20
weight: 500
takeaway:
size: 28
weight: 500
note:
size: 20
weight: 400
colors:
ground: "#FFFFFF"
surface: "#F4F6F9"
ink: "#131820"
muted: "#667183"
accent: "#1F5FA8"
rule: "#DBE1E9"
series:
- "#1F5FA8"
- "#A85A2E"
- "#D47A41"
- "#668CB9"
- "#1C8C79"
rules:
- 4窓口×各24件を1点ずつ描き、1点が1件を表す
- 横位置は応答時間、縦方向のずらしは点の重なりを避けるためだけに使う
- 密集部も外れ値も観測点として残す。平滑化密度や箱ひげ要約で置き換えない
- 架空の初回応答記録。窓口間で対象期間・計測の起点を揃える{
"format": "slide-16x9",
"density": "medium",
"layout": {
"kind": "axis",
"canvas": {
"w": 1920,
"h": 1080
},
"margin": {
"top": 100,
"right": 140,
"bottom": 100,
"left": 140
}
},
"type": {
"title": {
"size": 46,
"weight": 700,
"tracking": "0.01em"
},
"subtitle": {
"size": 22,
"weight": 500
},
"axisTitle": {
"size": 22,
"weight": 700
},
"tick": {
"size": 20,
"weight": 500
},
"channel": {
"size": 24,
"weight": 700
},
"count": {
"size": 22,
"weight": 700
},
"legend": {
"size": 20,
"weight": 500
},
"takeaway": {
"size": 28,
"weight": 500
},
"note": {
"size": 20,
"weight": 400
}
},
"colors": {
"ground": "#FFFFFF",
"surface": "#F4F6F9",
"ink": "#131820",
"muted": "#667183",
"accent": "#1F5FA8",
"rule": "#DBE1E9",
"series": [
"#1F5FA8",
"#A85A2E",
"#D47A41",
"#668CB9",
"#1C8C79"
]
},
"rules": [
"4窓口×各24件を1点ずつ描き、1点が1件を表す",
"横位置は応答時間、縦方向のずらしは点の重なりを避けるためだけに使う",
"密集部も外れ値も観測点として残す。平滑化密度や箱ひげ要約で置き換えない",
"架空の初回応答記録。窓口間で対象期間・計測の起点を揃える"
]
} /designs/beeswarm-plot-support-response-samples/pattern.html — 版そのものの HTML。書体の部分集合ごと同梱で、開けばこの絵がそのまま出ます。
<!doctype html>
<meta charset="utf-8"><title>初回応答時間の分布 — メールに60分超の標本が多い</title>
<meta name="dv-font" content="Zen Kaku Gothic New:400;500;700"><link rel="stylesheet" href="./font.css">
<style>:root{--ground:#FFFFFF;--surface:#F4F6F9;--ink:#131820;--muted:#667183;--accent:#1F5FA8;--rule:#DBE1E9;--series-1:#1F5FA8;--series-2:#A85A2E;--series-3:#D47A41;--series-4:#668CB9;--series-5:#1C8C79;}
*{box-sizing:border-box;margin:0}html,body{width:1920px;height:1080px}body{font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif}.artboard{width:1920px;height:1080px;padding:100px 140px;background:var(--ground);color:var(--ink)}.content{width:100%;height:100%;position:relative}.figure{position:absolute;left:-140px;top:-100px;width:1920px;height:1080px}</style>
<div class="artboard" data-artboard><div class="content" data-content><svg class="figure" width="1920" height="1080" viewBox="0 0 1920 1080" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="4窓口の初回応答時間を各24件の個別点で比較したビースウォーム図。メールは60分を超える標本が13件で最も多い。">
<style>.figure{font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif}.ground{fill:var(--ground)}.ink{fill:var(--ink)}.muted{fill:var(--muted)}.rule{stroke:var(--rule)}.title{font-size:46px;font-weight:700;letter-spacing:.01em}.subtitle{font-size:22px;font-weight:500}.axis-title{font-size:22px;font-weight:700}.tick{font-size:20px;font-weight:500}.channel{font-size:24px;font-weight:700}.count{font-size:22px;font-weight:700}.takeaway{font-size:28px;font-weight:500}.note{font-size:20px;font-weight:400}.legend{font-size:20px;font-weight:500}.dot{stroke:var(--ground);stroke-width:2}</style>
<rect class="ground" width="1920" height="1080"/><text class="ink title" data-type="title" x="140" y="153">初回応答時間の分布 — メールに60分超の標本が多い</text><text class="muted subtitle" data-type="subtitle" x="140" y="201">窓口別 n=24 / 個々の応答時間(分) / 架空データ</text><line class="rule" x1="140" y1="238" x2="1780" y2="238" stroke-width="2"/><text class="ink axis-title" data-type="axisTitle" x="960" y="294" text-anchor="middle">各点が1件の記録 — 重なりを避けて個別値を残す</text><text class="muted tick" x="1760" y="352" text-anchor="end">60分超の件数</text><line class="rule" x1="520" y1="370" x2="520" y2="794" stroke-width="1"/><line class="rule" x1="695" y1="370" x2="695" y2="794" stroke-width="1"/><line class="rule" x1="870" y1="370" x2="870" y2="794" stroke-width="1"/><line class="rule" x1="1045" y1="370" x2="1045" y2="794" stroke-width="1"/><line class="rule" x1="1220" y1="370" x2="1220" y2="794" stroke-width="1"/><line class="rule" x1="1395" y1="370" x2="1395" y2="794" stroke-width="1"/><line class="rule" x1="1570" y1="370" x2="1570" y2="794" stroke-width="1"/><line class="rule" x1="520" y1="794" x2="1570" y2="794" stroke-width="1.5"/><text class="ink channel" data-type="channel" x="140" y="434" dominant-baseline="central">チャット</text><circle class="dot" data-value="8" cx="566.7" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="10" cx="578.3" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="12" cx="590.0" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="14" cx="601.7" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="15" cx="607.5" cy="452.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="16" cx="613.3" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="18" cx="625.0" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="19" cx="630.8" cy="452.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="20" cx="636.7" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="22" cx="648.3" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="23" cx="654.2" cy="452.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="24" cx="660.0" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="25" cx="665.8" cy="398.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="27" cx="677.5" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="29" cx="689.2" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="31" cx="700.8" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="33" cx="712.5" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="35" cx="724.2" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="38" cx="741.7" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="42" cx="765.0" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="45" cx="782.5" cy="416.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="49" cx="805.8" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="55" cx="840.8" cy="434.0" r="8.5" fill="var(--series-1)"/><circle class="dot" data-value="68" cx="916.7" cy="434.0" r="8.5" fill="var(--series-1)"/><text class="ink count" data-type="count" x="1760" y="434" text-anchor="end" dominant-baseline="central">1/24</text><text class="ink channel" data-type="channel" x="140" y="540" dominant-baseline="central">メール</text><circle class="dot" data-value="18" cx="625.0" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="24" cx="660.0" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="29" cx="689.2" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="34" cx="718.3" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="38" cx="741.7" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="41" cx="759.2" cy="522.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="45" cx="782.5" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="49" cx="805.8" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="52" cx="823.3" cy="522.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="55" cx="840.8" cy="540.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="58" cx="858.3" cy="522.0" r="8.5" fill="var(--series-2)"/><circle class="dot" data-value="62" cx="881.7" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="65" cx="899.2" cy="522.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="68" cx="916.7" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="71" cx="934.2" cy="522.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="76" cx="963.3" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="82" cx="998.3" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="91" cx="1050.8" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="96" cx="1080.0" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="104" cx="1126.7" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="112" cx="1173.3" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="125" cx="1249.2" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="142" cx="1348.3" cy="540.0" r="8.5" fill="var(--series-3)"/><circle class="dot" data-value="168" cx="1500.0" cy="540.0" r="8.5" fill="var(--series-3)"/><text class="ink count" data-type="count" x="1760" y="540" text-anchor="end" dominant-baseline="central">13/24</text><text class="ink channel" data-type="channel" x="140" y="646" dominant-baseline="central">電話</text><circle class="dot" data-value="12" cx="590.0" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="18" cx="625.0" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="20" cx="636.7" cy="628.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="22" cx="648.3" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="25" cx="665.8" cy="628.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="28" cx="683.3" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="32" cx="706.7" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="35" cx="724.2" cy="628.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="38" cx="741.7" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="42" cx="765.0" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="45" cx="782.5" cy="628.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="49" cx="805.8" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="53" cx="829.2" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="57" cx="852.5" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="61" cx="875.8" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="65" cx="899.2" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="70" cx="928.3" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="74" cx="951.7" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="78" cx="975.0" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="83" cx="1004.2" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="88" cx="1033.3" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="94" cx="1068.3" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="105" cx="1132.5" cy="646.0" r="8.5" fill="var(--series-4)"/><circle class="dot" data-value="121" cx="1225.8" cy="646.0" r="8.5" fill="var(--series-4)"/><text class="ink count" data-type="count" x="1760" y="646" text-anchor="end" dominant-baseline="central">10/24</text><text class="ink channel" data-type="channel" x="140" y="752" dominant-baseline="central">ポータル</text><circle class="dot" data-value="5" cx="549.2" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="7" cx="560.8" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="9" cx="572.5" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="11" cx="584.2" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="13" cx="595.8" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="14" cx="601.7" cy="770.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="16" cx="613.3" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="18" cx="625.0" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="20" cx="636.7" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="22" cx="648.3" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="24" cx="660.0" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="26" cx="671.7" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="28" cx="683.3" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="30" cx="695.0" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="32" cx="706.7" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="34" cx="718.3" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="36" cx="730.0" cy="734.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="38" cx="741.7" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="42" cx="765.0" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="46" cx="788.3" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="50" cx="811.7" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="54" cx="835.0" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="61" cx="875.8" cy="752.0" r="8.5" fill="var(--series-5)"/><circle class="dot" data-value="73" cx="945.8" cy="752.0" r="8.5" fill="var(--series-5)"/><text class="ink count" data-type="count" x="1760" y="752" text-anchor="end" dominant-baseline="central">2/24</text><text class="muted tick" data-type="tick" x="520" y="826" text-anchor="middle">0</text><text class="muted tick" data-type="tick" x="695" y="826" text-anchor="middle">30</text><text class="muted tick" data-type="tick" x="870" y="826" text-anchor="middle">60</text><text class="muted tick" data-type="tick" x="1045" y="826" text-anchor="middle">90</text><text class="muted tick" data-type="tick" x="1220" y="826" text-anchor="middle">120</text><text class="muted tick" data-type="tick" x="1395" y="826" text-anchor="middle">150</text><text class="muted tick" data-type="tick" x="1570" y="826" text-anchor="middle">180</text><text class="muted tick" x="1045" y="858" text-anchor="middle">初回応答時間(分)</text><g class="legend" dominant-baseline="central"><circle cx="520" cy="909" r="8.5" fill="var(--series-3)"/><text class="ink" data-type="legend" x="540" y="909">メールの60分超</text><text class="muted" x="790" y="909">点色は窓口、縦ずらしは重なり回避を示す</text></g><text class="ink takeaway" data-type="takeaway" x="960" y="960" text-anchor="middle">60分超はメール13/24件 — 平滑化せず個々の外れ値を確認</text><line class="rule" x1="140" y1="987" x2="1780" y2="987" stroke-width="1"/><text class="muted note" data-type="note" x="140" y="1022">縦方向のずらし量に値の意味はない。各窓口の対象期間・計測開始点を揃えて比較する。</text></svg></div></div> /designs/beeswarm-plot-support-response-samples/font.css — 全部入りには入れていない
/* dv-subset v2 — generated by scripts/subset-font.mjs. Do not edit.
* font Zen Kaku Gothic New 400;500;700
* chars 101 (19ec259ac308df03)
*
* pattern.html の文字だけを含む部分集合。描画時に外部へ取りに行かないよう同梱する。
* 版の文字を変えたら取り直すこと — 忘れると足りない字が豆腐になる。
* その取り忘れは pattern-entries.test.ts が上の指紋で検出する。
*/
@font-face {
font-family: 'Zen Kaku Gothic New';
font-style: normal;
font-weight: 400;
font-display: block;
src: url(./font-0.woff2) format('woff2');
unicode-range: U+2f-36, U+38-39, U+3d, U+6e, U+2014, U+3001-3002, U+3005, U+3044, U+3048, U+304b-304c, U+3051-3052, U+3057-305c, U+3066-3067, U+306a-306b, U+306e-3071, U+3089-308c, U+3092, U+3099-309a, U+30bf-30c3, U+30c6-30c9, U+30db-30dd, U+30e1, U+30e3, U+30eb, U+30fb-30fc, U+4ef6, U+500b, U+5024, U+5206, U+521d, U+5225, U+5316, U+53e3, U+5404, U+5411, U+5473, U+56de, U+5916, U+591a, U+59cb, U+5bfe, U+5e03, U+5e73, U+5fdc, U+610f, U+63c3, U+6570, U+65b9, U+6642, U+671f, U+672c, U+67b6, U+6a19, U+6b8b, U+6bd4, U+6e2c, U+6ed1, U+70b9, U+78ba, U+793a, U+7a7a, U+7a93, U+7b54, U+7e26, U+8272, U+8a08, U+8a18, U+8a71, U+8a8d, U+8c61, U+8d85, U+8f03, U+907f, U+91cd, U+91cf, U+9332, U+958b, U+9593, U+96fb, U+ff08-ff09;
}
@font-face {
font-family: 'Zen Kaku Gothic New';
font-style: normal;
font-weight: 500;
font-display: block;
src: url(./font-1.woff2) format('woff2');
unicode-range: U+2f-36, U+38-39, U+3d, U+6e, U+2014, U+3001-3002, U+3005, U+3044, U+3048, U+304b-304c, U+3051-3052, U+3057-305c, U+3066-3067, U+306a-306b, U+306e-3071, U+3089-308c, U+3092, U+3099-309a, U+30bf-30c3, U+30c6-30c9, U+30db-30dd, U+30e1, U+30e3, U+30eb, U+30fb-30fc, U+4ef6, U+500b, U+5024, U+5206, U+521d, U+5225, U+5316, U+53e3, U+5404, U+5411, U+5473, U+56de, U+5916, U+591a, U+59cb, U+5bfe, U+5e03, U+5e73, U+5fdc, U+610f, U+63c3, U+6570, U+65b9, U+6642, U+671f, U+672c, U+67b6, U+6a19, U+6b8b, U+6bd4, U+6e2c, U+6ed1, U+70b9, U+78ba, U+793a, U+7a7a, U+7a93, U+7b54, U+7e26, U+8272, U+8a08, U+8a18, U+8a71, U+8a8d, U+8c61, U+8d85, U+8f03, U+907f, U+91cd, U+91cf, U+9332, U+958b, U+9593, U+96fb, U+ff08-ff09;
}
@font-face {
font-family: 'Zen Kaku Gothic New';
font-style: normal;
font-weight: 700;
font-display: block;
src: url(./font-2.woff2) format('woff2');
unicode-range: U+2f-36, U+38-39, U+3d, U+6e, U+2014, U+3001-3002, U+3005, U+3044, U+3048, U+304b-304c, U+3051-3052, U+3057-305c, U+3066-3067, U+306a-306b, U+306e-3071, U+3089-308c, U+3092, U+3099-309a, U+30bf-30c3, U+30c6-30c9, U+30db-30dd, U+30e1, U+30e3, U+30eb, U+30fb-30fc, U+4ef6, U+500b, U+5024, U+5206, U+521d, U+5225, U+5316, U+53e3, U+5404, U+5411, U+5473, U+56de, U+5916, U+591a, U+59cb, U+5bfe, U+5e03, U+5e73, U+5fdc, U+610f, U+63c3, U+6570, U+65b9, U+6642, U+671f, U+672c, U+67b6, U+6a19, U+6b8b, U+6bd4, U+6e2c, U+6ed1, U+70b9, U+78ba, U+793a, U+7a7a, U+7a93, U+7b54, U+7e26, U+8272, U+8a08, U+8a18, U+8a71, U+8a8d, U+8c61, U+8d85, U+8f03, U+907f, U+91cd, U+91cf, U+9332, U+958b, U+9593, U+96fb, U+ff08-ff09;
}
窓口別の初回応答時間はどこに集まり、個別に確認すべき長い応答はどれか。
横位置を応答時間、行を窓口に割り当て、1件を1点で描く。同じ時間付近に点が重ならないよう、上下に詰めて配列する。縦方向の位置は値ではなく衝突回避だけを表すので、数値比較は横軸で行う。
架空の各24件ではメールの60分超が13件で最も多く、168分の長い応答も残る。バイオリン図は平滑化密度の形を要約し、箱ひげ図は四分位範囲へまとめるのに対し、beeswarm plotは個々の観測を保ち、標本が小さいときの集中と外れ値をそのまま確かめられる。実測サービス性能の主張ではない。