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 service 24px / 700 range 20px / 500 legend 20px / 500 takeaway 28px / 500 note 20px / 400 ## 配色 地 #FFFFFF / 面 #F4F6F9 / 文字 #131820 / 補助 #667183 / 強調 #1F5FA8 / 罫 #DBE1E9 / #E8C7B5 / #D78D64 / #A85A2E / #AEC4DF / #668CB9 / #1F5FA8 ## 外すと崩れる点 - 4サービス×26週を同じ通常水準からの偏差(件)でそろえて示す - 帯の高さが偏差の絶対値、暖色が通常より多い方向、青色が少ない方向を表す - 4件刻みの3帯を同じ基準線から積み、値域を小さな高さへ折り畳む - 架空の週次データ。比較時は通常水準・集計窓・単位をそろえる 内容は[ここに自分の内容を書く]に置き換えてください。寸法と配色はそのまま守ってください。 正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/horizon-chart-weekly-support-deviations/pattern.html
/ai/designs/horizon-chart-weekly-support-deviations.json
format: slide-16x9
density: medium
layout:
kind: timeline
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
service:
size: 24
weight: 700
range:
size: 20
weight: 500
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:
- "#E8C7B5"
- "#D78D64"
- "#A85A2E"
- "#AEC4DF"
- "#668CB9"
- "#1F5FA8"
rules:
- 4サービス×26週を同じ通常水準からの偏差(件)でそろえて示す
- 帯の高さが偏差の絶対値、暖色が通常より多い方向、青色が少ない方向を表す
- 4件刻みの3帯を同じ基準線から積み、値域を小さな高さへ折り畳む
- 架空の週次データ。比較時は通常水準・集計窓・単位をそろえる{
"format": "slide-16x9",
"density": "medium",
"layout": {
"kind": "timeline",
"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
},
"service": {
"size": 24,
"weight": 700
},
"range": {
"size": 20,
"weight": 500
},
"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": [
"#E8C7B5",
"#D78D64",
"#A85A2E",
"#AEC4DF",
"#668CB9",
"#1F5FA8"
]
},
"rules": [
"4サービス×26週を同じ通常水準からの偏差(件)でそろえて示す",
"帯の高さが偏差の絶対値、暖色が通常より多い方向、青色が少ない方向を表す",
"4件刻みの3帯を同じ基準線から積み、値域を小さな高さへ折り畳む",
"架空の週次データ。比較時は通常水準・集計窓・単位をそろえる"
]
} /designs/horizon-chart-weekly-support-deviations/pattern.html — 版そのものの HTML。書体の部分集合ごと同梱で、開けばこの絵がそのまま出ます。
<!doctype html>
<meta charset="utf-8">
<title>週次件数の振れ — 決済APIに最大−11件の谷</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:#E8C7B5;--series-2:#D78D64;--series-3:#A85A2E;--series-4:#AEC4DF;--series-5:#668CB9;--series-6:#1F5FA8;}
*{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サービスの26週次件数と通常水準との差を色帯で示すホライズンチャート。暖色が通常より多く、青色が少ない状態。">
<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}.service{font-size:24px;font-weight:700}.range{font-size:20px;font-weight:500}.takeaway{font-size:28px;font-weight:500}.note{font-size:20px;font-weight:400}.legend{font-size:20px;font-weight:500}
.pos-1{fill:var(--series-1)}.pos-2{fill:var(--series-2)}.pos-3{fill:var(--series-3)}.neg-1{fill:var(--series-4)}.neg-2{fill:var(--series-5)}.neg-3{fill:var(--series-6)}
</style>
<rect class="ground" width="1920" height="1080"/>
<text class="ink title" data-type="title" x="140" y="153">週次件数の振れ — 決済APIに最大−11件の谷</text>
<text class="muted subtitle" data-type="subtitle" x="140" y="201">4サービス・26週間 / 通常水準との差(件) / 架空データ</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">通常水準からの増減を、同じ小さな高さで期間横断比較する</text>
<text class="ink service" data-type="service" x="140" y="436" dominant-baseline="central">決済API</text>
<line class="rule" x1="425" y1="458" x2="1490" y2="458" stroke-width="1"/>
<g class="horizon"><path class="pos-1" d="M 445 458 L 486 453 L 527 448 L 568 453 L 609 458 L 650 458 L 691 443 L 732 438 L 773 438 L 814 438 L 855 438 L 896 438 L 937 448 L 978 453 L 1019 458 L 1060 458 L 1101 458 L 1142 458 L 1183 458 L 1224 458 L 1265 458 L 1306 458 L 1347 458 L 1388 458 L 1429 448 L 1470 453 L 1470 458 L 1429 458 L 1388 458 L 1347 458 L 1306 458 L 1265 458 L 1224 458 L 1183 458 L 1142 458 L 1101 458 L 1060 458 L 1019 458 L 978 458 L 937 458 L 896 458 L 855 458 L 814 458 L 773 458 L 732 458 L 691 458 L 650 458 L 609 458 L 568 458 L 527 458 L 486 458 L 445 458 Z"/><path class="pos-2" d="M 445 458 L 486 458 L 527 458 L 568 458 L 609 458 L 650 458 L 691 458 L 732 433 L 773 423 L 814 418 L 855 418 L 896 428 L 937 458 L 978 458 L 1019 458 L 1060 458 L 1101 458 L 1142 458 L 1183 458 L 1224 458 L 1265 458 L 1306 458 L 1347 458 L 1388 458 L 1429 458 L 1470 458 L 1470 458 L 1429 458 L 1388 458 L 1347 458 L 1306 458 L 1265 458 L 1224 458 L 1183 458 L 1142 458 L 1101 458 L 1060 458 L 1019 458 L 978 458 L 937 458 L 896 438 L 855 438 L 814 438 L 773 438 L 732 438 L 691 458 L 650 458 L 609 458 L 568 458 L 527 458 L 486 458 L 445 458 Z"/><path class="pos-3" d="M 445 458 L 486 458 L 527 458 L 568 458 L 609 458 L 650 458 L 691 458 L 732 458 L 773 458 L 814 413 L 855 458 L 896 458 L 937 458 L 978 458 L 1019 458 L 1060 458 L 1101 458 L 1142 458 L 1183 458 L 1224 458 L 1265 458 L 1306 458 L 1347 458 L 1388 458 L 1429 458 L 1470 458 L 1470 458 L 1429 458 L 1388 458 L 1347 458 L 1306 458 L 1265 458 L 1224 458 L 1183 458 L 1142 458 L 1101 458 L 1060 458 L 1019 458 L 978 458 L 937 458 L 896 458 L 855 458 L 814 418 L 773 458 L 732 458 L 691 458 L 650 458 L 609 458 L 568 458 L 527 458 L 486 458 L 445 458 Z"/><path class="neg-1" d="M 445 458 L 486 458 L 527 458 L 568 458 L 609 453 L 650 458 L 691 458 L 732 458 L 773 458 L 814 458 L 855 458 L 896 458 L 937 458 L 978 458 L 1019 458 L 1060 453 L 1101 443 L 1142 438 L 1183 438 L 1224 438 L 1265 438 L 1306 438 L 1347 448 L 1388 458 L 1429 458 L 1470 458 L 1470 458 L 1429 458 L 1388 458 L 1347 458 L 1306 458 L 1265 458 L 1224 458 L 1183 458 L 1142 458 L 1101 458 L 1060 458 L 1019 458 L 978 458 L 937 458 L 896 458 L 855 458 L 814 458 L 773 458 L 732 458 L 691 458 L 650 458 L 609 458 L 568 458 L 527 458 L 486 458 L 445 458 Z"/><path class="neg-2" d="M 445 458 L 486 458 L 527 458 L 568 458 L 609 458 L 650 458 L 691 458 L 732 458 L 773 458 L 814 458 L 855 458 L 896 458 L 937 458 L 978 458 L 1019 458 L 1060 458 L 1101 458 L 1142 433 L 1183 418 L 1224 418 L 1265 418 L 1306 458 L 1347 458 L 1388 458 L 1429 458 L 1470 458 L 1470 458 L 1429 458 L 1388 458 L 1347 458 L 1306 458 L 1265 438 L 1224 438 L 1183 438 L 1142 438 L 1101 458 L 1060 458 L 1019 458 L 978 458 L 937 458 L 896 458 L 855 458 L 814 458 L 773 458 L 732 458 L 691 458 L 650 458 L 609 458 L 568 458 L 527 458 L 486 458 L 445 458 Z"/><path class="neg-3" d="M 445 458 L 486 458 L 527 458 L 568 458 L 609 458 L 650 458 L 691 458 L 732 458 L 773 458 L 814 458 L 855 458 L 896 458 L 937 458 L 978 458 L 1019 458 L 1060 458 L 1101 458 L 1142 458 L 1183 413 L 1224 403 L 1265 458 L 1306 458 L 1347 458 L 1388 458 L 1429 458 L 1470 458 L 1470 458 L 1429 458 L 1388 458 L 1347 458 L 1306 458 L 1265 458 L 1224 418 L 1183 418 L 1142 458 L 1101 458 L 1060 458 L 1019 458 L 978 458 L 937 458 L 896 458 L 855 458 L 814 458 L 773 458 L 732 458 L 691 458 L 650 458 L 609 458 L 568 458 L 527 458 L 486 458 L 445 458 Z"/></g>
<text class="ink range" data-type="range" x="1760" y="438" text-anchor="end" dominant-baseline="central">−11〜+9件</text>
<text class="ink service" data-type="service" x="140" y="544" dominant-baseline="central">注文処理</text>
<line class="rule" x1="425" y1="566" x2="1490" y2="566" stroke-width="1"/>
<g class="horizon"><path class="pos-1" d="M 445 566 L 486 566 L 527 561 L 568 556 L 609 561 L 650 551 L 691 546 L 732 546 L 773 546 L 814 546 L 855 546 L 896 546 L 937 546 L 978 556 L 1019 561 L 1060 561 L 1101 566 L 1142 566 L 1183 566 L 1224 566 L 1265 566 L 1306 566 L 1347 566 L 1388 566 L 1429 561 L 1470 556 L 1470 566 L 1429 566 L 1388 566 L 1347 566 L 1306 566 L 1265 566 L 1224 566 L 1183 566 L 1142 566 L 1101 566 L 1060 566 L 1019 566 L 978 566 L 937 566 L 896 566 L 855 566 L 814 566 L 773 566 L 732 566 L 691 566 L 650 566 L 609 566 L 568 566 L 527 566 L 486 566 L 445 566 Z"/><path class="pos-2" d="M 445 566 L 486 566 L 527 566 L 568 566 L 609 566 L 650 566 L 691 566 L 732 536 L 773 526 L 814 526 L 855 526 L 896 526 L 937 541 L 978 566 L 1019 566 L 1060 566 L 1101 566 L 1142 566 L 1183 566 L 1224 566 L 1265 566 L 1306 566 L 1347 566 L 1388 566 L 1429 566 L 1470 566 L 1470 566 L 1429 566 L 1388 566 L 1347 566 L 1306 566 L 1265 566 L 1224 566 L 1183 566 L 1142 566 L 1101 566 L 1060 566 L 1019 566 L 978 566 L 937 546 L 896 546 L 855 546 L 814 546 L 773 546 L 732 546 L 691 566 L 650 566 L 609 566 L 568 566 L 527 566 L 486 566 L 445 566 Z"/><path class="pos-3" d="M 445 566 L 486 566 L 527 566 L 568 566 L 609 566 L 650 566 L 691 566 L 732 566 L 773 566 L 814 516 L 855 506 L 896 521 L 937 566 L 978 566 L 1019 566 L 1060 566 L 1101 566 L 1142 566 L 1183 566 L 1224 566 L 1265 566 L 1306 566 L 1347 566 L 1388 566 L 1429 566 L 1470 566 L 1470 566 L 1429 566 L 1388 566 L 1347 566 L 1306 566 L 1265 566 L 1224 566 L 1183 566 L 1142 566 L 1101 566 L 1060 566 L 1019 566 L 978 566 L 937 566 L 896 526 L 855 526 L 814 526 L 773 566 L 732 566 L 691 566 L 650 566 L 609 566 L 568 566 L 527 566 L 486 566 L 445 566 Z"/><path class="neg-1" d="M 445 561 L 486 566 L 527 566 L 568 566 L 609 566 L 650 566 L 691 566 L 732 566 L 773 566 L 814 566 L 855 566 L 896 566 L 937 566 L 978 566 L 1019 566 L 1060 566 L 1101 566 L 1142 556 L 1183 546 L 1224 546 L 1265 546 L 1306 546 L 1347 551 L 1388 561 L 1429 566 L 1470 566 L 1470 566 L 1429 566 L 1388 566 L 1347 566 L 1306 566 L 1265 566 L 1224 566 L 1183 566 L 1142 566 L 1101 566 L 1060 566 L 1019 566 L 978 566 L 937 566 L 896 566 L 855 566 L 814 566 L 773 566 L 732 566 L 691 566 L 650 566 L 609 566 L 568 566 L 527 566 L 486 566 L 445 566 Z"/><path class="neg-2" d="M 445 566 L 486 566 L 527 566 L 568 566 L 609 566 L 650 566 L 691 566 L 732 566 L 773 566 L 814 566 L 855 566 L 896 566 L 937 566 L 978 566 L 1019 566 L 1060 566 L 1101 566 L 1142 566 L 1183 566 L 1224 536 L 1265 526 L 1306 541 L 1347 566 L 1388 566 L 1429 566 L 1470 566 L 1470 566 L 1429 566 L 1388 566 L 1347 566 L 1306 546 L 1265 546 L 1224 546 L 1183 566 L 1142 566 L 1101 566 L 1060 566 L 1019 566 L 978 566 L 937 566 L 896 566 L 855 566 L 814 566 L 773 566 L 732 566 L 691 566 L 650 566 L 609 566 L 568 566 L 527 566 L 486 566 L 445 566 Z"/><path class="neg-3" d="M 445 566 L 486 566 L 527 566 L 568 566 L 609 566 L 650 566 L 691 566 L 732 566 L 773 566 L 814 566 L 855 566 L 896 566 L 937 566 L 978 566 L 1019 566 L 1060 566 L 1101 566 L 1142 566 L 1183 566 L 1224 566 L 1265 566 L 1306 566 L 1347 566 L 1388 566 L 1429 566 L 1470 566 L 1470 566 L 1429 566 L 1388 566 L 1347 566 L 1306 566 L 1265 566 L 1224 566 L 1183 566 L 1142 566 L 1101 566 L 1060 566 L 1019 566 L 978 566 L 937 566 L 896 566 L 855 566 L 814 566 L 773 566 L 732 566 L 691 566 L 650 566 L 609 566 L 568 566 L 527 566 L 486 566 L 445 566 Z"/></g>
<text class="ink range" data-type="range" x="1760" y="546" text-anchor="end" dominant-baseline="central">−8〜+12件</text>
<text class="ink service" data-type="service" x="140" y="652" dominant-baseline="central">アカウント</text>
<line class="rule" x1="425" y1="674" x2="1490" y2="674" stroke-width="1"/>
<g class="horizon"><path class="pos-1" d="M 445 674 L 486 674 L 527 674 L 568 674 L 609 674 L 650 674 L 691 674 L 732 669 L 773 659 L 814 664 L 855 669 L 896 674 L 937 674 L 978 674 L 1019 674 L 1060 674 L 1101 674 L 1142 674 L 1183 674 L 1224 674 L 1265 674 L 1306 664 L 1347 654 L 1388 654 L 1429 654 L 1470 654 L 1470 674 L 1429 674 L 1388 674 L 1347 674 L 1306 674 L 1265 674 L 1224 674 L 1183 674 L 1142 674 L 1101 674 L 1060 674 L 1019 674 L 978 674 L 937 674 L 896 674 L 855 674 L 814 674 L 773 674 L 732 674 L 691 674 L 650 674 L 609 674 L 568 674 L 527 674 L 486 674 L 445 674 Z"/><path class="pos-2" d="M 445 674 L 486 674 L 527 674 L 568 674 L 609 674 L 650 674 L 691 674 L 732 674 L 773 674 L 814 674 L 855 674 L 896 674 L 937 674 L 978 674 L 1019 674 L 1060 674 L 1101 674 L 1142 674 L 1183 674 L 1224 674 L 1265 674 L 1306 674 L 1347 674 L 1388 644 L 1429 634 L 1470 634 L 1470 654 L 1429 654 L 1388 654 L 1347 674 L 1306 674 L 1265 674 L 1224 674 L 1183 674 L 1142 674 L 1101 674 L 1060 674 L 1019 674 L 978 674 L 937 674 L 896 674 L 855 674 L 814 674 L 773 674 L 732 674 L 691 674 L 650 674 L 609 674 L 568 674 L 527 674 L 486 674 L 445 674 Z"/><path class="pos-3" d="M 445 674 L 486 674 L 527 674 L 568 674 L 609 674 L 650 674 L 691 674 L 732 674 L 773 674 L 814 674 L 855 674 L 896 674 L 937 674 L 978 674 L 1019 674 L 1060 674 L 1101 674 L 1142 674 L 1183 674 L 1224 674 L 1265 674 L 1306 674 L 1347 674 L 1388 674 L 1429 674 L 1470 624 L 1470 634 L 1429 674 L 1388 674 L 1347 674 L 1306 674 L 1265 674 L 1224 674 L 1183 674 L 1142 674 L 1101 674 L 1060 674 L 1019 674 L 978 674 L 937 674 L 896 674 L 855 674 L 814 674 L 773 674 L 732 674 L 691 674 L 650 674 L 609 674 L 568 674 L 527 674 L 486 674 L 445 674 Z"/><path class="neg-1" d="M 445 674 L 486 669 L 527 664 L 568 659 L 609 654 L 650 664 L 691 674 L 732 674 L 773 674 L 814 674 L 855 674 L 896 669 L 937 659 L 978 654 L 1019 654 L 1060 654 L 1101 654 L 1142 654 L 1183 654 L 1224 664 L 1265 674 L 1306 674 L 1347 674 L 1388 674 L 1429 674 L 1470 674 L 1470 674 L 1429 674 L 1388 674 L 1347 674 L 1306 674 L 1265 674 L 1224 674 L 1183 674 L 1142 674 L 1101 674 L 1060 674 L 1019 674 L 978 674 L 937 674 L 896 674 L 855 674 L 814 674 L 773 674 L 732 674 L 691 674 L 650 674 L 609 674 L 568 674 L 527 674 L 486 674 L 445 674 Z"/><path class="neg-2" d="M 445 674 L 486 674 L 527 674 L 568 674 L 609 674 L 650 674 L 691 674 L 732 674 L 773 674 L 814 674 L 855 674 L 896 674 L 937 674 L 978 649 L 1019 639 L 1060 634 L 1101 634 L 1142 644 L 1183 674 L 1224 674 L 1265 674 L 1306 674 L 1347 674 L 1388 674 L 1429 674 L 1470 674 L 1470 674 L 1429 674 L 1388 674 L 1347 674 L 1306 674 L 1265 674 L 1224 674 L 1183 674 L 1142 654 L 1101 654 L 1060 654 L 1019 654 L 978 654 L 937 674 L 896 674 L 855 674 L 814 674 L 773 674 L 732 674 L 691 674 L 650 674 L 609 674 L 568 674 L 527 674 L 486 674 L 445 674 Z"/><path class="neg-3" d="M 445 674 L 486 674 L 527 674 L 568 674 L 609 674 L 650 674 L 691 674 L 732 674 L 773 674 L 814 674 L 855 674 L 896 674 L 937 674 L 978 674 L 1019 674 L 1060 629 L 1101 674 L 1142 674 L 1183 674 L 1224 674 L 1265 674 L 1306 674 L 1347 674 L 1388 674 L 1429 674 L 1470 674 L 1470 674 L 1429 674 L 1388 674 L 1347 674 L 1306 674 L 1265 674 L 1224 674 L 1183 674 L 1142 674 L 1101 674 L 1060 634 L 1019 674 L 978 674 L 937 674 L 896 674 L 855 674 L 814 674 L 773 674 L 732 674 L 691 674 L 650 674 L 609 674 L 568 674 L 527 674 L 486 674 L 445 674 Z"/></g>
<text class="ink range" data-type="range" x="1760" y="654" text-anchor="end" dominant-baseline="central">−9〜+10件</text>
<text class="ink service" data-type="service" x="140" y="760" dominant-baseline="central">検索</text>
<line class="rule" x1="425" y1="782" x2="1490" y2="782" stroke-width="1"/>
<g class="horizon"><path class="pos-1" d="M 445 777 L 486 772 L 527 767 L 568 762 L 609 772 L 650 782 L 691 782 L 732 782 L 773 782 L 814 782 L 855 782 L 896 782 L 937 782 L 978 782 L 1019 782 L 1060 782 L 1101 782 L 1142 782 L 1183 772 L 1224 762 L 1265 762 L 1306 762 L 1347 762 L 1388 762 L 1429 762 L 1470 767 L 1470 782 L 1429 782 L 1388 782 L 1347 782 L 1306 782 L 1265 782 L 1224 782 L 1183 782 L 1142 782 L 1101 782 L 1060 782 L 1019 782 L 978 782 L 937 782 L 896 782 L 855 782 L 814 782 L 773 782 L 732 782 L 691 782 L 650 782 L 609 782 L 568 782 L 527 782 L 486 782 L 445 782 Z"/><path class="pos-2" d="M 445 782 L 486 782 L 527 782 L 568 782 L 609 782 L 650 782 L 691 782 L 732 782 L 773 782 L 814 782 L 855 782 L 896 782 L 937 782 L 978 782 L 1019 782 L 1060 782 L 1101 782 L 1142 782 L 1183 782 L 1224 782 L 1265 752 L 1306 742 L 1347 742 L 1388 742 L 1429 757 L 1470 782 L 1470 782 L 1429 762 L 1388 762 L 1347 762 L 1306 762 L 1265 762 L 1224 782 L 1183 782 L 1142 782 L 1101 782 L 1060 782 L 1019 782 L 978 782 L 937 782 L 896 782 L 855 782 L 814 782 L 773 782 L 732 782 L 691 782 L 650 782 L 609 782 L 568 782 L 527 782 L 486 782 L 445 782 Z"/><path class="pos-3" d="M 445 782 L 486 782 L 527 782 L 568 782 L 609 782 L 650 782 L 691 782 L 732 782 L 773 782 L 814 782 L 855 782 L 896 782 L 937 782 L 978 782 L 1019 782 L 1060 782 L 1101 782 L 1142 782 L 1183 782 L 1224 782 L 1265 782 L 1306 737 L 1347 727 L 1388 782 L 1429 782 L 1470 782 L 1470 782 L 1429 782 L 1388 782 L 1347 742 L 1306 742 L 1265 782 L 1224 782 L 1183 782 L 1142 782 L 1101 782 L 1060 782 L 1019 782 L 978 782 L 937 782 L 896 782 L 855 782 L 814 782 L 773 782 L 732 782 L 691 782 L 650 782 L 609 782 L 568 782 L 527 782 L 486 782 L 445 782 Z"/><path class="neg-1" d="M 445 782 L 486 782 L 527 782 L 568 782 L 609 782 L 650 782 L 691 777 L 732 772 L 773 762 L 814 762 L 855 762 L 896 762 L 937 762 L 978 762 L 1019 762 L 1060 762 L 1101 772 L 1142 782 L 1183 782 L 1224 782 L 1265 782 L 1306 782 L 1347 782 L 1388 782 L 1429 782 L 1470 782 L 1470 782 L 1429 782 L 1388 782 L 1347 782 L 1306 782 L 1265 782 L 1224 782 L 1183 782 L 1142 782 L 1101 782 L 1060 782 L 1019 782 L 978 782 L 937 782 L 896 782 L 855 782 L 814 782 L 773 782 L 732 782 L 691 782 L 650 782 L 609 782 L 568 782 L 527 782 L 486 782 L 445 782 Z"/><path class="neg-2" d="M 445 782 L 486 782 L 527 782 L 568 782 L 609 782 L 650 782 L 691 782 L 732 782 L 773 782 L 814 752 L 855 742 L 896 742 L 937 742 L 978 742 L 1019 747 L 1060 782 L 1101 782 L 1142 782 L 1183 782 L 1224 782 L 1265 782 L 1306 782 L 1347 782 L 1388 782 L 1429 782 L 1470 782 L 1470 782 L 1429 782 L 1388 782 L 1347 782 L 1306 782 L 1265 782 L 1224 782 L 1183 782 L 1142 782 L 1101 782 L 1060 782 L 1019 762 L 978 762 L 937 762 L 896 762 L 855 762 L 814 762 L 773 782 L 732 782 L 691 782 L 650 782 L 609 782 L 568 782 L 527 782 L 486 782 L 445 782 Z"/><path class="neg-3" d="M 445 782 L 486 782 L 527 782 L 568 782 L 609 782 L 650 782 L 691 782 L 732 782 L 773 782 L 814 782 L 855 782 L 896 732 L 937 722 L 978 737 L 1019 782 L 1060 782 L 1101 782 L 1142 782 L 1183 782 L 1224 782 L 1265 782 L 1306 782 L 1347 782 L 1388 782 L 1429 782 L 1470 782 L 1470 782 L 1429 782 L 1388 782 L 1347 782 L 1306 782 L 1265 782 L 1224 782 L 1183 782 L 1142 782 L 1101 782 L 1060 782 L 1019 782 L 978 742 L 937 742 L 896 742 L 855 782 L 814 782 L 773 782 L 732 782 L 691 782 L 650 782 L 609 782 L 568 782 L 527 782 L 486 782 L 445 782 Z"/></g>
<text class="ink range" data-type="range" x="1760" y="762" text-anchor="end" dominant-baseline="central">−12〜+11件</text>
<line class="rule" x1="425" y1="794" x2="1490" y2="794" stroke-width="1.5"/><line class="rule" x1="445" y1="794" x2="445" y2="802"/><text class="muted tick" data-type="tick" x="445" y="824" text-anchor="middle">1週</text><line class="rule" x1="650" y1="794" x2="650" y2="802"/><text class="muted tick" data-type="tick" x="650" y="824" text-anchor="middle">6週</text><line class="rule" x1="937" y1="794" x2="937" y2="802"/><text class="muted tick" data-type="tick" x="937" y="824" text-anchor="middle">13週</text><line class="rule" x1="1224" y1="794" x2="1224" y2="802"/><text class="muted tick" data-type="tick" x="1224" y="824" text-anchor="middle">20週</text><line class="rule" x1="1470" y1="794" x2="1470" y2="802"/><text class="muted tick" data-type="tick" x="1470" y="824" text-anchor="middle">26週</text>
<g class="legend" dominant-baseline="central"><rect class="pos-1" x="240" y="856" width="28" height="24"/><rect class="pos-2" x="268" y="856" width="28" height="24"/><rect class="pos-3" x="296" y="856" width="28" height="24"/><text class="ink" data-type="legend" x="338" y="868">通常より多い</text><text class="muted" x="514" y="868">帯の高さ:0–4 / 4–8 / 8–12件</text><rect class="neg-1" x="920" y="856" width="28" height="24"/><rect class="neg-2" x="948" y="856" width="28" height="24"/><rect class="neg-3" x="976" y="856" width="28" height="24"/><text class="ink" x="1018" y="868">通常より少ない</text><text class="muted" x="1240" y="868">暖色・青色で方向を区別</text></g>
<text class="ink takeaway" data-type="takeaway" x="960" y="928" text-anchor="middle">決済APIは18週目に−11件 — 色帯で増減幅と続いた期間を読む</text>
<line class="rule" x1="140" y1="974" x2="1780" y2="974" stroke-width="1"/><text class="muted note" data-type="note" x="140" y="1013">帯の高さは通常平均との差の絶対値、色相は方向を示す。通常水準と集計窓を揃えて比較する。</text>
</svg></div></div> /designs/horizon-chart-weekly-support-deviations/font.css — 全部入りには入れていない
/* dv-subset v2 — generated by scripts/subset-font.mjs. Do not edit.
* font Zen Kaku Gothic New 400;500;700
* chars 114 (c770942323b29121)
*
* 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+2b, U+2f-34, U+36, U+38-39, U+41, U+49, U+50, U+2013-2014, U+2212, U+3001-3002, U+301c, U+3044, U+3048, U+304b-304c, U+3055-305a, U+305f-3060, U+3066-306b, U+306e-3070, U+3080, U+3088-308c, U+3092, U+3099, U+30a2, U+30a6, U+30ab-30ac, U+30b5-30b6, U+30b9-30ba, U+30bf-30c0, U+30c6-30c9, U+30d2-30d3, U+30f3-30f4, U+30fb-30fc, U+4ef6, U+5024, U+51e6, U+5225, U+533a, U+540c, U+5411, U+5747, U+5897, U+591a, U+5927, U+5bfe, U+5c0f, U+5c11, U+5dee, U+5e2f, U+5e38, U+5e45, U+5e73, U+632f, U+63c3, U+6570, U+6587, U+65ad, U+65b9, U+6696, U+6700, U+671f, U+67b6, U+691c, U+6a2a, U+6b21, U+6bd4, U+6c34, U+6c7a, U+6ce8, U+6e08, U+6e1b, U+6e96, U+7406, U+76ee, U+76f8, U+793a, U+7a7a, U+7a93, U+7d22, U+7d76, U+7d9a, U+8272, U+8a08, U+8aad, U+8c37, U+8f03, U+901a, U+9031, U+9593, U+96c6, U+9752, U+9ad8, U+ff08-ff09, U+ff1a;
}
@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+2b, U+2f-34, U+36, U+38-39, U+41, U+49, U+50, U+2013-2014, U+2212, U+3001-3002, U+301c, U+3044, U+3048, U+304b-304c, U+3055-305a, U+305f-3060, U+3066-306b, U+306e-3070, U+3080, U+3088-308c, U+3092, U+3099, U+30a2, U+30a6, U+30ab-30ac, U+30b5-30b6, U+30b9-30ba, U+30bf-30c0, U+30c6-30c9, U+30d2-30d3, U+30f3-30f4, U+30fb-30fc, U+4ef6, U+5024, U+51e6, U+5225, U+533a, U+540c, U+5411, U+5747, U+5897, U+591a, U+5927, U+5bfe, U+5c0f, U+5c11, U+5dee, U+5e2f, U+5e38, U+5e45, U+5e73, U+632f, U+63c3, U+6570, U+6587, U+65ad, U+65b9, U+6696, U+6700, U+671f, U+67b6, U+691c, U+6a2a, U+6b21, U+6bd4, U+6c34, U+6c7a, U+6ce8, U+6e08, U+6e1b, U+6e96, U+7406, U+76ee, U+76f8, U+793a, U+7a7a, U+7a93, U+7d22, U+7d76, U+7d9a, U+8272, U+8a08, U+8aad, U+8c37, U+8f03, U+901a, U+9031, U+9593, U+96c6, U+9752, U+9ad8, U+ff08-ff09, U+ff1a;
}
@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+2b, U+2f-34, U+36, U+38-39, U+41, U+49, U+50, U+2013-2014, U+2212, U+3001-3002, U+301c, U+3044, U+3048, U+304b-304c, U+3055-305a, U+305f-3060, U+3066-306b, U+306e-3070, U+3080, U+3088-308c, U+3092, U+3099, U+30a2, U+30a6, U+30ab-30ac, U+30b5-30b6, U+30b9-30ba, U+30bf-30c0, U+30c6-30c9, U+30d2-30d3, U+30f3-30f4, U+30fb-30fc, U+4ef6, U+5024, U+51e6, U+5225, U+533a, U+540c, U+5411, U+5747, U+5897, U+591a, U+5927, U+5bfe, U+5c0f, U+5c11, U+5dee, U+5e2f, U+5e38, U+5e45, U+5e73, U+632f, U+63c3, U+6570, U+6587, U+65ad, U+65b9, U+6696, U+6700, U+671f, U+67b6, U+691c, U+6a2a, U+6b21, U+6bd4, U+6c34, U+6c7a, U+6ce8, U+6e08, U+6e1b, U+6e96, U+7406, U+76ee, U+76f8, U+793a, U+7a7a, U+7a93, U+7d22, U+7d76, U+7d9a, U+8272, U+8a08, U+8aad, U+8c37, U+8f03, U+901a, U+9031, U+9593, U+96c6, U+9752, U+9ad8, U+ff08-ff09, U+ff1a;
}
4サービスで通常件数からの増減はいつ起き、どの程度の幅で続いたか。
横方向を26週間、縦方向を通常水準との差の絶対値にする。偏差を4件刻みの3帯へ分け、各小分割の同じ基準線へ折り畳む。暖色は通常より多い期間、青色は少ない期間を示す。色の濃さは基準から離れる帯を表し、色と高さを合わせて方向と大きさを読む。
決済APIでは18週目に−11件まで落ちた。ホライズンチャートは多系列・長期間を固定高さで比べるため、総量構成の帯厚を読むstacked areaとは異なり、密度分布の形を比べるviolin plotとも異なる。値は架空であり、各サービスの通常水準・集計窓が異なる場合は直接比較できない。