آمارهای بانک مرکزی نشان میدهد تعداد چکهای الکترونیک صادرشده در شبکه بانکی طی سهماهه نخست سال ۱۴۰۵، در مقایسه با مدت مشابه سال گذشته، حدود ۲۷۷ درصد افزایش یافته است. در همین بازه، نزدیک به ۵۸۰ هزار دستهچک الکترونیک نیز در اختیار مشتریان قرار گرفته که از رشد ۲۱۳ درصدی این شاخص حکایت دارد.
const values = [
63,
500,
3000,
// ادامه مقادیر ماهانه…
];
.w2p-echeque-chart,
.w2p-echeque-chart * {
box-sizing: border-box;
}
.w2p-echeque-chart {
–background: #315d9d;
–line: #dff000;
–text: #ffffff;
–muted: rgba(255, 255, 255, 0.76);
–grid: rgba(255, 255, 255, 0.13);
width: 100%;
max-width: 1100px;
margin: 28px auto;
padding: clamp(18px, 3vw, 34px);
overflow: hidden;
background: var(–background);
color: var(–text);
direction: rtl;
font-family:
Sahel,
Vazirmatn,
Tahoma,
Arial,
sans-serif;
box-shadow:
0 18px 45px rgba(17, 47, 89, 0.18);
}
.w2p-echeque-chart__header {
margin-bottom: 12px;
text-align: center;
}
.w2p-echeque-chart__title {
margin: 0;
color: #fff;
font-size: clamp(20px, 3vw, 34px);
font-weight: 900;
line-height: 1.55;
letter-spacing: -0.03em;
}
.w2p-echeque-chart__subtitle {
margin: 5px 0 0;
color: var(–muted);
font-size: clamp(12px, 1.5vw, 15px);
line-height: 1.8;
}
.w2p-echeque-chart__stage {
position: relative;
width: 100%;
height: clamp(410px, 54vw, 570px);
direction: ltr;
}
.w2p-echeque-chart svg {
display: block;
width: 100%;
height: 100%;
overflow: visible;
}
.w2p-echeque-chart__grid {
stroke: var(–grid);
stroke-width: 1;
vector-effect: non-scaling-stroke;
}
.w2p-echeque-chart__year-separator {
stroke: rgba(255, 255, 255, 0.09);
stroke-width: 1;
vector-effect: non-scaling-stroke;
}
.w2p-echeque-chart__axis-label {
fill: rgba(255, 255, 255, 0.82);
font-family:
Sahel,
Vazirmatn,
Tahoma,
Arial,
sans-serif;
font-size: 12px;
}
.w2p-echeque-chart__month-label {
fill: rgba(255, 255, 255, 0.86);
font-family:
Sahel,
Vazirmatn,
Tahoma,
Arial,
sans-serif;
font-size: 10px;
}
.w2p-echeque-chart__year-label {
fill: #fff;
font-family:
Sahel,
Vazirmatn,
Tahoma,
Arial,
sans-serif;
font-size: 13px;
font-weight: 700;
}
.w2p-echeque-chart__line {
fill: none;
stroke: var(–line);
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
filter:
drop-shadow(
0 0 4px rgba(223, 240, 0, 0.28)
);
vector-effect: non-scaling-stroke;
}
.w2p-echeque-chart__annotation-line {
stroke: rgba(255, 255, 255, 0.3);
stroke-width: 1;
vector-effect: non-scaling-stroke;
}
.w2p-echeque-chart__annotation-text {
fill: rgba(255, 255, 255, 0.95);
font-family:
Sahel,
Vazirmatn,
Tahoma,
Arial,
sans-serif;
font-size: 12px;
font-weight: 700;
paint-order: stroke;
stroke: rgba(49, 93, 157, 0.86);
stroke-width: 4px;
stroke-linejoin: round;
}
.w2p-echeque-chart__guide {
stroke: rgba(255, 255, 255, 0.68);
stroke-width: 1;
stroke-dasharray: 4 5;
opacity: 0;
pointer-events: none;
vector-effect: non-scaling-stroke;
}
.w2p-echeque-chart__dot {
fill: var(–background);
stroke: var(–line);
stroke-width: 4;
opacity: 0;
pointer-events: none;
vector-effect: non-scaling-stroke;
}
.w2p-echeque-chart__tooltip {
position: absolute;
z-index: 10;
min-width: 155px;
padding: 10px 13px;
background: #fff;
color: #17345d;
box-shadow:
0 12px 30px rgba(13, 38, 74, 0.28);
opacity: 0;
visibility: hidden;
transform:
translate(
-50%,
calc(-100% – 17px)
);
transition:
opacity 0.12s ease;
direction: rtl;
text-align: right;
pointer-events: none;
font-family:
Sahel,
Vazirmatn,
Tahoma,
Arial,
sans-serif;
}
.w2p-echeque-chart__tooltip strong {
display: block;
font-size: 17px;
font-weight: 900;
line-height: 1.5;
}
.w2p-echeque-chart__tooltip span {
display: block;
margin-top: 2px;
color: #66768c;
font-size: 12px;
white-space: nowrap;
}
.w2p-echeque-chart__tooltip::after {
content: “”;
position: absolute;
bottom: -7px;
left: 50%;
width: 14px;
height: 14px;
background: #fff;
transform:
translateX(-50%)
rotate(45deg);
}
.w2p-echeque-chart__stage.is-hovering
.w2p-echeque-chart__tooltip,
.w2p-echeque-chart__stage.is-hovering
.w2p-echeque-chart__guide,
.w2p-echeque-chart__stage.is-hovering
.w2p-echeque-chart__dot {
opacity: 1;
visibility: visible;
}
.w2p-echeque-chart__footer {
display: flex;
justify-content: space-between;
gap: 18px;
margin-top: 12px;
padding-top: 12px;
border-top:
1px solid rgba(255, 255, 255, 0.16);
color: rgba(255, 255, 255, 0.72);
font-size: 11px;
line-height: 1.8;
}
.w2p-echeque-chart__footer b {
color: #fff;
}
@media (max-width: 680px) {
.w2p-echeque-chart {
padding-inline: 10px;
}
.w2p-echeque-chart__stage {
height: 450px;
}
.w2p-echeque-chart__footer {
display: block;
padding-inline: 6px;
}
.w2p-echeque-chart__footer span:last-child {
display: block;
margin-top: 4px;
}
}
@media (prefers-reduced-motion: reduce) {
.w2p-echeque-chart__tooltip {
transition: none;
}
}
تعداد چکهای الکترونیکی صادرشده از آبان ۱۴۰۱ تا خرداد ۱۴۰۵
تعداد چکهای صادرشده در هر ماه
(() => {
const roots = document.querySelectorAll(
“.w2p-echeque-chart:not([data-chart-ready])”
);
if (!roots.length) return;
const months = [
“فروردین”,
“اردیبهشت”,
“خرداد”,
“تیر”,
“مرداد”,
“شهریور”,
“مهر”,
“آبان”,
“آذر”,
“دی”,
“بهمن”,
“اسفند”
];
/*
* دادهها از روی تصویر بازسازی شدهاند.
* ترتیب از آبان ۱۴۰۱ تا خرداد ۱۴۰۵ است.
*
* برای استفاده از داده دقیق، فقط اعداد
* آرایه values را تغییر بده.
*/
const values = [
63,
500,
3000,
10903,
14019,
7788,
4673,
9346,
31153,
21807,
21807,
17134,
17134,
14019,
21807,
34268,
19664,
12461,
28037,
40498,
52960,
65421,
80997,
133956,
152648,
208668,
171340,
137072,
156892,
105919,
199719,
190031,
152648,
271028,
318292,
481165,
572814,
670782,
601246,
717846,
414330,
303268,
888216,
643064
];
/*
* شماره نقاطی که مقدارشان بهصورت ثابت
* روی نمودار نمایش داده میشود.
*/
const annotations = {
0: {
dx: 18,
dy: -38
},
16: {
dx: -6,
dy: -42
},
25: {
dx: -10,
dy: -50
},
28: {
dx: 20,
dy: -45
},
30: {
dx: 10,
dy: -52
},
34: {
dx: -16,
dy: -48
},
35: {
dx: -22,
dy: -54
},
36: {
dx: -12,
dy: -58
},
37: {
dx: 0,
dy: -54
},
39: {
dx: 0,
dy: -55
},
41: {
dx: 18,
dy: 38
},
42: {
dx: -8,
dy: -58
},
43: {
dx: -34,
dy: 38
}
};
const faNumber = new Intl.NumberFormat(
“fa-IR”,
{
maximumFractionDigits: 0
}
);
const toPersianNumber = value => {
return faNumber.format(value);
};
roots.forEach(root => {
root.setAttribute(
“data-chart-ready”,
“true”
);
const stage = root.querySelector(
“.w2p-echeque-chart__stage”
);
const svg = stage.querySelector(“svg”);
const tooltip = stage.querySelector(
“.w2p-echeque-chart__tooltip”
);
const tooltipValue =
tooltip.querySelector(“strong”);
const tooltipDate =
tooltip.querySelector(“span”);
const SVG_NS =
“http://www.w3.org/2000/svg”;
const createSvg = (
name,
attributes = {}
) => {
const element =
document.createElementNS(
SVG_NS,
name
);
Object.entries(attributes).forEach(
([key, value]) => {
element.setAttribute(
key,
value
);
}
);
return element;
};
let currentYear = 1401;
let currentMonthIndex = 7;
const data = values.map(value => {
const item = {
year: currentYear,
month: months[currentMonthIndex],
value
};
currentMonthIndex += 1;
if (currentMonthIndex > 11) {
currentMonthIndex = 0;
currentYear += 1;
}
return item;
});
let points = [];
let linePath;
let guide;
let dot;
let overlay;
let animationStarted = false;
function draw() {
const width = Math.max(
320,
Math.round(stage.clientWidth)
);
const height = Math.max(
390,
Math.round(stage.clientHeight)
);
const mobile = width {
return (
margin.left +
(
index /
(data.length – 1)
) *
plotWidth
);
};
const yScale = value => {
return (
margin.top +
(
1 –
(
(value – yMinimum) /
(yMaximum – yMinimum)
)
) *
plotHeight
);
};
const gridGroup =
createSvg(“g”);
for (
let value = 0;
value {
const existing =
yearGroups.find(
group =>
group.year === item.year
);
if (existing) {
existing.end = index;
} else {
yearGroups.push({
year: item.year,
start: index,
end: index
});
}
}
);
yearGroups.forEach(
(group, groupIndex) => {
const middle =
(
xScale(group.start) +
xScale(group.end)
) /
2;
const yearLabel =
createSvg(“text”, {
x: middle,
y: height – 10,
class:
“w2p-echeque-chart__year-label”,
“text-anchor”: “middle”
});
yearLabel.textContent =
toPersianNumber(group.year);
gridGroup.appendChild(
yearLabel
);
if (groupIndex > 0) {
const separatorX =
(
xScale(
group.start – 1
) +
xScale(group.start)
) /
2;
gridGroup.appendChild(
createSvg(“line”, {
x1: separatorX,
y1: baseline + 5,
x2: separatorX,
y2: height – 30,
class:
“w2p-echeque-chart__year-separator”
})
);
}
}
);
/*
* در نمایشگر کوچک، بخشی از نام ماهها
* مخفی میشوند تا روی هم قرار نگیرند.
*/
const monthStep =
width < 480
? 4
: width {
if (
index % monthStep !== 0 &&
index !== data.length – 1
) {
return;
}
const positionX =
xScale(index);
const positionY =
baseline + 10;
const monthLabel =
createSvg(“text”, {
x: positionX,
y: positionY,
class:
“w2p-echeque-chart__month-label”,
“text-anchor”: “end”,
direction: “rtl”,
transform:
`rotate(-90 ` +
`${positionX} ` +
`${positionY})`
});
monthLabel.textContent =
item.month;
gridGroup.appendChild(
monthLabel
);
}
);
svg.appendChild(gridGroup);
points = data.map(
(item, index) => ({
x: xScale(index),
y: yScale(item.value),
index,
…item
})
);
const lineDefinition = points
.map((point, index) => {
const command =
index === 0
? “M”
: “L”;
return (
`${command} ` +
`${point.x.toFixed(2)} ` +
`${point.y.toFixed(2)}`
);
})
.join(” “);
linePath = createSvg(“path”, {
d: lineDefinition,
class:
“w2p-echeque-chart__line”
});
svg.appendChild(linePath);
/*
* برچسب مقادیر مهم
*/
if (width >= 720) {
const annotationGroup =
createSvg(“g”);
Object.entries(
annotations
).forEach(
([indexText, options]) => {
const index =
Number(indexText);
const point =
points[index];
if (!point) return;
let labelX =
point.x + options.dx;
let labelY =
point.y + options.dy;
labelX = Math.max(
margin.left + 12,
Math.min(
width –
margin.right –
12,
labelX
)
);
labelY = Math.max(
margin.top + 12,
Math.min(
baseline – 8,
labelY
)
);
annotationGroup.appendChild(
createSvg(“line”, {
x1: point.x,
y1: point.y,
x2: labelX,
y2:
labelY +
(
options.dy < 0
? 7
: -12
),
class:
"w2p-echeque-chart__annotation-line"
})
);
const text =
createSvg("text", {
x: labelX,
y: labelY,
class:
"w2p-echeque-chart__annotation-text",
"text-anchor":
options.dx 5
? “start”
: “middle”
});
text.textContent =
toPersianNumber(
point.value
);
annotationGroup.appendChild(
text
);
}
);
svg.appendChild(
annotationGroup
);
}
guide = createSvg(“line”, {
x1: margin.left,
y1: margin.top,
x2: margin.left,
y2: baseline,
class:
“w2p-echeque-chart__guide”
});
dot = createSvg(“circle”, {
cx: margin.left,
cy: baseline,
r: mobile ? 5 : 6,
class:
“w2p-echeque-chart__dot”
});
overlay = createSvg(“rect”, {
x: margin.left,
y: margin.top,
width: plotWidth,
height: plotHeight,
fill: “transparent”,
style:
“cursor:crosshair;” +
“touch-action:pan-y”
});
svg.append(
guide,
dot,
overlay
);
const lineLength =
linePath.getTotalLength();
linePath.style.strokeDasharray =
`${lineLength}`;
linePath.style.strokeDashoffset =
animationStarted
? “0”
: `${lineLength}`;
function move(event) {
const rectangle =
svg.getBoundingClientRect();
const source =
event.touches
? event.touches[0]
: event;
if (!source) return;
const localX =
(
(
source.clientX –
rectangle.left
) /
rectangle.width
) *
width;
const rawIndex =
(
(
localX –
margin.left
) /
plotWidth
) *
(points.length – 1);
const nearestIndex =
Math.max(
0,
Math.min(
points.length – 1,
Math.round(rawIndex)
)
);
const nearest =
points[nearestIndex];
guide.setAttribute(
“x1”,
nearest.x
);
guide.setAttribute(
“x2”,
nearest.x
);
dot.setAttribute(
“cx”,
nearest.x
);
dot.setAttribute(
“cy”,
nearest.y
);
tooltipValue.textContent =
`${toPersianNumber(
nearest.value
)} چک`;
tooltipDate.textContent =
`${nearest.month} ` +
`${toPersianNumber(
nearest.year
)}`;
const leftPercentage =
(
nearest.x /
width
) *
100;
const topPercentage =
(
nearest.y /
height
) *
100;
tooltip.style.left =
`${Math.min(
87,
Math.max(
13,
leftPercentage
)
)}%`;
tooltip.style.top =
`${Math.max(
20,
topPercentage
)}%`;
stage.classList.add(
“is-hovering”
);
}
overlay.addEventListener(
“mousemove”,
move
);
overlay.addEventListener(
“touchstart”,
move,
{
passive: true
}
);
overlay.addEventListener(
“touchmove”,
move,
{
passive: true
}
);
overlay.addEventListener(
“mouseleave”,
() => {
stage.classList.remove(
“is-hovering”
);
}
);
overlay.addEventListener(
“touchend”,
() => {
window.setTimeout(
() => {
stage.classList.remove(
“is-hovering”
);
},
1000
);
},
{
passive: true
}
);
}
function startAnimation() {
if (animationStarted) return;
animationStarted = true;
if (!linePath) return;
if (
window.matchMedia(
“(prefers-reduced-motion: reduce)”
).matches
) {
linePath.style.strokeDashoffset =
“0”;
return;
}
const lineLength =
linePath.getTotalLength();
linePath.style.strokeDasharray =
`${lineLength}`;
linePath.style.strokeDashoffset =
`${lineLength}`;
linePath.getBoundingClientRect();
linePath.style.transition =
“stroke-dashoffset 2s ” +
“cubic-bezier(.2,.72,.2,1)”;
linePath.style.strokeDashoffset =
“0”;
}
draw();
const observer =
new IntersectionObserver(
entries => {
if (
entries[0].isIntersecting
) {
startAnimation();
observer.disconnect();
}
},
{
threshold: 0.2
}
);
observer.observe(root);
let resizeTimer;
const resizeObserver =
new ResizeObserver(() => {
clearTimeout(
resizeTimer
);
resizeTimer =
window.setTimeout(
draw,
120
);
});
resizeObserver.observe(stage);
});
})();
مشتریان شبکه بانکی در سهماهه نخست سال ۱۴۰۵ در مجموع یک میلیون و ۸۳۴ هزار و ۵۴۸ فقره چک الکترونیک صادر کردهاند. این رقم در سهماهه نخست سال ۱۴۰۴، معادل ۴۸۵ هزار و ۸۱۲ فقره بود؛ بنابراین تعداد چکهای الکترونیک صادرشده طی یک سال به بیش از ۳.۷ برابر رسیده است.
بررسی آمار ماهانه نشان میدهد صدور چک الکترونیک در فروردینماه با ۳۰۳ هزار و ۲۶۸ فقره آغاز شده است. تعداد چکهای صادرشده در اردیبهشتماه به ۸۸۸ هزار و ۲۱۶ فقره رسید؛ رقمی که بالاترین میزان صدور ماهانه چک الکترونیک در سهماهه نخست امسال محسوب میشود.
در خردادماه نیز ۶۴۳ هزار و ۶۴ فقره چک الکترونیک صادر شده است. به این ترتیب، حدود ۱۶.۵ درصد از چکهای الکترونیک فصل بهار در فروردین، ۴۸.۴ درصد در اردیبهشت و ۳۵.۱ درصد در خرداد صادر شدهاند.
با وجود کاهش تعداد چکهای الکترونیک خردادماه در مقایسه با اردیبهشت، آمار بانک مرکزی نشان میدهد در آخرین ماه بهار، سهم چک الکترونیک از کل چکهای صادرشده مشتریان شبکه بانکی به پنج درصد رسیده است. به بیان دیگر، از هر ۱۰۰ فقره چک صادرشده در خردادماه، پنج فقره بهصورت الکترونیکی بوده است.
نزدیک به ۵۸۰ هزار دستهچک الکترونیک صادر شد
افزایش استفاده از چک الکترونیک تنها به تعداد برگههای صادرشده محدود نبوده است. در سهماهه نخست سال ۱۴۰۵، حدود ۵۸۰ هزار دستهچک الکترونیک از سوی شبکه بانکی در اختیار مشتریان قرار گرفته است.
تعداد دستهچکهای الکترونیک صادرشده در این دوره نسبت به سهماهه نخست سال ۱۴۰۴ حدود ۲۱۳ درصد افزایش یافته است. رشد ۲۱۳ درصدی به این معناست که میزان صدور دستهچک الکترونیک در بهار امسال به بیش از سه برابر دوره مشابه سال گذشته رسیده است.
آمارهای خردادماه همچنین تصویری از سهم دستهچک الکترونیک در میان مشتریان حقیقی ارائه میکند. در این ماه، نسبت تعداد دستهچکهای الکترونیک اشخاص حقیقی به مجموع دستهچکهای الکترونیک و کاغذی صادرشده برای این گروه، به ۲۶.۸۵ درصد رسیده است.
.w2p-real-checkbook-chart,
.w2p-real-checkbook-chart * {
box-sizing: border-box;
}
.w2p-real-checkbook-chart {
–background: #315d9d;
–line: #dff000;
–text: #ffffff;
–muted: rgba(255, 255, 255, 0.76);
–grid: rgba(255, 255, 255, 0.13);
width: 100%;
max-width: 1100px;
margin: 28px auto;
padding: clamp(18px, 3vw, 34px);
overflow: hidden;
background: var(–background);
color: var(–text);
direction: rtl;
font-family: Sahel, Vazirmatn, Tahoma, Arial, sans-serif;
box-shadow: 0 18px 45px rgba(17, 47, 89, 0.18);
}
.w2p-real-checkbook-chart__header {
margin-bottom: 12px;
text-align: center;
}
.w2p-real-checkbook-chart__title {
margin: 0;
color: #fff;
font-size: clamp(20px, 3vw, 34px);
font-weight: 900;
line-height: 1.55;
letter-spacing: -0.03em;
}
.w2p-real-checkbook-chart__subtitle {
margin: 5px 0 0;
color: var(–muted);
font-size: clamp(12px, 1.5vw, 15px);
line-height: 1.8;
}
.w2p-real-checkbook-chart__stage {
position: relative;
width: 100%;
height: clamp(410px, 54vw, 570px);
direction: ltr;
}
.w2p-real-checkbook-chart svg {
display: block;
width: 100%;
height: 100%;
overflow: visible;
}
.w2p-real-checkbook-chart__grid {
stroke: var(–grid);
stroke-width: 1;
vector-effect: non-scaling-stroke;
}
.w2p-real-checkbook-chart__year-separator {
stroke: rgba(255, 255, 255, 0.09);
stroke-width: 1;
vector-effect: non-scaling-stroke;
}
.w2p-real-checkbook-chart__axis-label {
fill: rgba(255, 255, 255, 0.82);
font-family: Sahel, Vazirmatn, Tahoma, Arial, sans-serif;
font-size: 12px;
}
.w2p-real-checkbook-chart__month-label {
fill: rgba(255, 255, 255, 0.86);
font-family: Sahel, Vazirmatn, Tahoma, Arial, sans-serif;
font-size: 10px;
}
.w2p-real-checkbook-chart__year-label {
fill: #fff;
font-family: Sahel, Vazirmatn, Tahoma, Arial, sans-serif;
font-size: 13px;
font-weight: 700;
}
.w2p-real-checkbook-chart__line {
fill: none;
stroke: var(–line);
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
filter: drop-shadow(0 0 4px rgba(223, 240, 0, 0.28));
vector-effect: non-scaling-stroke;
}
.w2p-real-checkbook-chart__annotation-line {
stroke: rgba(255, 255, 255, 0.3);
stroke-width: 1;
vector-effect: non-scaling-stroke;
}
.w2p-real-checkbook-chart__annotation-text {
fill: rgba(255, 255, 255, 0.95);
font-family: Sahel, Vazirmatn, Tahoma, Arial, sans-serif;
font-size: 12px;
font-weight: 700;
paint-order: stroke;
stroke: rgba(49, 93, 157, 0.86);
stroke-width: 4px;
stroke-linejoin: round;
}
.w2p-real-checkbook-chart__guide {
stroke: rgba(255, 255, 255, 0.68);
stroke-width: 1;
stroke-dasharray: 4 5;
opacity: 0;
pointer-events: none;
vector-effect: non-scaling-stroke;
}
.w2p-real-checkbook-chart__dot {
fill: var(–background);
stroke: var(–line);
stroke-width: 4;
opacity: 0;
pointer-events: none;
vector-effect: non-scaling-stroke;
}
.w2p-real-checkbook-chart__tooltip {
position: absolute;
z-index: 10;
min-width: 155px;
padding: 10px 13px;
background: #fff;
color: #17345d;
box-shadow: 0 12px 30px rgba(13, 38, 74, 0.28);
opacity: 0;
visibility: hidden;
transform: translate(-50%, calc(-100% – 17px));
transition: opacity 0.12s ease;
direction: rtl;
text-align: right;
pointer-events: none;
font-family: Sahel, Vazirmatn, Tahoma, Arial, sans-serif;
}
.w2p-real-checkbook-chart__tooltip strong {
display: block;
font-size: 17px;
font-weight: 900;
line-height: 1.5;
}
.w2p-real-checkbook-chart__tooltip span {
display: block;
margin-top: 2px;
color: #66768c;
font-size: 12px;
white-space: nowrap;
}
.w2p-real-checkbook-chart__tooltip::after {
content: “”;
position: absolute;
bottom: -7px;
left: 50%;
width: 14px;
height: 14px;
background: #fff;
transform: translateX(-50%) rotate(45deg);
}
.w2p-real-checkbook-chart__stage.is-hovering
.w2p-real-checkbook-chart__tooltip,
.w2p-real-checkbook-chart__stage.is-hovering
.w2p-real-checkbook-chart__guide,
.w2p-real-checkbook-chart__stage.is-hovering
.w2p-real-checkbook-chart__dot {
opacity: 1;
visibility: visible;
}
.w2p-real-checkbook-chart__footer {
display: flex;
justify-content: space-between;
gap: 18px;
margin-top: 12px;
padding-top: 12px;
border-top: 1px solid rgba(255, 255, 255, 0.16);
color: rgba(255, 255, 255, 0.72);
font-size: 11px;
line-height: 1.8;
}
.w2p-real-checkbook-chart__footer b {
color: #fff;
}
@media (max-width: 680px) {
.w2p-real-checkbook-chart {
padding-inline: 10px;
}
.w2p-real-checkbook-chart__stage {
height: 450px;
}
.w2p-real-checkbook-chart__footer {
display: block;
padding-inline: 6px;
}
.w2p-real-checkbook-chart__footer span:last-child {
display: block;
margin-top: 4px;
}
}
@media (prefers-reduced-motion: reduce) {
.w2p-real-checkbook-chart__tooltip {
transition: none;
}
}
تعداد دسته چک الکترونیک اشخاص حقیقی
تعداد دستهچکهای صادرشده در هر ماه از آبان ۱۴۰۱ تا خرداد ۱۴۰۵
(() => {
const roots = document.querySelectorAll(
“.w2p-real-checkbook-chart:not([data-chart-ready])”
);
if (!roots.length) return;
const months = [
“فروردین”,
“اردیبهشت”,
“خرداد”,
“تیر”,
“مرداد”,
“شهریور”,
“مهر”,
“آبان”,
“آذر”,
“دی”,
“بهمن”,
“اسفند”
];
/*
* دادهها از روی تصویر بازسازی شدهاند.
* بازه: آبان ۱۴۰۱ تا خرداد ۱۴۰۵
* اگر داده دقیقتر داشتی، فقط همین آرایه را عوض کن.
*/
const values = [
19,
300,
1200,
5000,
3000,
5000,
10000,
20000,
40000,
50000,
48000,
54000,
49000,
48000,
45000,
42000,
13000,
41262,
50000,
80000,
60000,
50000,
140000,
100000,
105000,
106000,
40000,
52418,
30000,
78538,
65000,
55000,
85000,
90575,
118137,
169821,
210523,
200000,
225073,
120000,
97471,
90000,
293290,
189105
];
/*
* برچسبهایی که روی خود نمودار نمایش داده میشوند
*/
const annotations = {
0: { dx: 18, dy: -28 },
17: { dx: -6, dy: -38 },
22: { dx: 4, dy: -42 },
27: { dx: 10, dy: -36 },
29: { dx: 8, dy: -38 },
33: { dx: 10, dy: -42 },
34: { dx: 16, dy: -42 },
35: { dx: 8, dy: -48 },
36: { dx: 8, dy: -52 },
38: { dx: 0, dy: -50 },
40: { dx: -8, dy: 34 },
42: { dx: -10, dy: -58 },
43: { dx: -6, dy: 34 }
};
const faNumber = new Intl.NumberFormat(“fa-IR”, {
maximumFractionDigits: 0
});
const toPersianNumber = value => faNumber.format(value);
roots.forEach(root => {
root.setAttribute(“data-chart-ready”, “true”);
const stage = root.querySelector(
“.w2p-real-checkbook-chart__stage”
);
const svg = stage.querySelector(“svg”);
const tooltip = stage.querySelector(
“.w2p-real-checkbook-chart__tooltip”
);
const tooltipValue = tooltip.querySelector(“strong”);
const tooltipDate = tooltip.querySelector(“span”);
const SVG_NS = “http://www.w3.org/2000/svg”;
const createSvg = (name, attributes = {}) => {
const element = document.createElementNS(SVG_NS, name);
Object.entries(attributes).forEach(([key, value]) => {
element.setAttribute(key, value);
});
return element;
};
let currentYear = 1401;
let currentMonthIndex = 7;
const data = values.map(value => {
const item = {
year: currentYear,
month: months[currentMonthIndex],
value
};
currentMonthIndex += 1;
if (currentMonthIndex > 11) {
currentMonthIndex = 0;
currentYear += 1;
}
return item;
});
let points = [];
let linePath;
let guide;
let dot;
let overlay;
let animationStarted = false;
function draw() {
const width = Math.max(320, Math.round(stage.clientWidth));
const height = Math.max(390, Math.round(stage.clientHeight));
const mobile = width {
return (
margin.left +
(index / (data.length – 1)) * plotWidth
);
};
const yScale = value => {
return (
margin.top +
(1 – ((value – yMinimum) / (yMaximum – yMinimum))) *
plotHeight
);
};
const gridGroup = createSvg(“g”);
for (let value = 0; value {
const existing = yearGroups.find(
group => group.year === item.year
);
if (existing) {
existing.end = index;
} else {
yearGroups.push({
year: item.year,
start: index,
end: index
});
}
});
yearGroups.forEach((group, groupIndex) => {
const middle =
(xScale(group.start) + xScale(group.end)) / 2;
const yearLabel = createSvg(“text”, {
x: middle,
y: height – 10,
class: “w2p-real-checkbook-chart__year-label”,
“text-anchor”: “middle”
});
yearLabel.textContent = toPersianNumber(group.year);
gridGroup.appendChild(yearLabel);
if (groupIndex > 0) {
const separatorX =
(xScale(group.start – 1) + xScale(group.start)) / 2;
gridGroup.appendChild(
createSvg(“line”, {
x1: separatorX,
y1: baseline + 5,
x2: separatorX,
y2: height – 30,
class:
“w2p-real-checkbook-chart__year-separator”
})
);
}
});
const monthStep =
width < 480 ? 4 :
width {
if (index % monthStep !== 0 && index !== data.length – 1) {
return;
}
const positionX = xScale(index);
const positionY = baseline + 10;
const monthLabel = createSvg(“text”, {
x: positionX,
y: positionY,
class: “w2p-real-checkbook-chart__month-label”,
“text-anchor”: “end”,
direction: “rtl”,
transform: `rotate(-90 ${positionX} ${positionY})`
});
monthLabel.textContent = item.month;
gridGroup.appendChild(monthLabel);
});
svg.appendChild(gridGroup);
points = data.map((item, index) => ({
x: xScale(index),
y: yScale(item.value),
index,
…item
}));
const lineDefinition = points
.map((point, index) => {
const command = index === 0 ? “M” : “L”;
return `${command} ${point.x.toFixed(2)} ${point.y.toFixed(2)}`;
})
.join(” “);
linePath = createSvg(“path”, {
d: lineDefinition,
class: “w2p-real-checkbook-chart__line”
});
svg.appendChild(linePath);
if (width >= 720) {
const annotationGroup = createSvg(“g”);
Object.entries(annotations).forEach(([indexText, options]) => {
const index = Number(indexText);
const point = points[index];
if (!point) return;
let labelX = point.x + options.dx;
let labelY = point.y + options.dy;
labelX = Math.max(
margin.left + 12,
Math.min(width – margin.right – 12, labelX)
);
labelY = Math.max(
margin.top + 12,
Math.min(baseline – 8, labelY)
);
annotationGroup.appendChild(
createSvg(“line”, {
x1: point.x,
y1: point.y,
x2: labelX,
y2: labelY + (options.dy < 0 ? 7 : -12),
class:
"w2p-real-checkbook-chart__annotation-line"
})
);
const text = createSvg("text", {
x: labelX,
y: labelY,
class:
"w2p-real-checkbook-chart__annotation-text",
"text-anchor":
options.dx 5
? “start”
: “middle”
});
text.textContent = toPersianNumber(point.value);
annotationGroup.appendChild(text);
});
svg.appendChild(annotationGroup);
}
guide = createSvg(“line”, {
x1: margin.left,
y1: margin.top,
x2: margin.left,
y2: baseline,
class: “w2p-real-checkbook-chart__guide”
});
dot = createSvg(“circle”, {
cx: margin.left,
cy: baseline,
r: mobile ? 5 : 6,
class: “w2p-real-checkbook-chart__dot”
});
overlay = createSvg(“rect”, {
x: margin.left,
y: margin.top,
width: plotWidth,
height: plotHeight,
fill: “transparent”,
style: “cursor:crosshair;touch-action:pan-y”
});
svg.append(guide, dot, overlay);
const lineLength = linePath.getTotalLength();
linePath.style.strokeDasharray = `${lineLength}`;
linePath.style.strokeDashoffset = animationStarted
? “0”
: `${lineLength}`;
function move(event) {
const rectangle = svg.getBoundingClientRect();
const source = event.touches ? event.touches[0] : event;
if (!source) return;
const localX =
((source.clientX – rectangle.left) / rectangle.width) * width;
const rawIndex =
((localX – margin.left) / plotWidth) * (points.length – 1);
const nearestIndex = Math.max(
0,
Math.min(points.length – 1, Math.round(rawIndex))
);
const nearest = points[nearestIndex];
guide.setAttribute(“x1”, nearest.x);
guide.setAttribute(“x2”, nearest.x);
dot.setAttribute(“cx”, nearest.x);
dot.setAttribute(“cy”, nearest.y);
tooltipValue.textContent =
`${toPersianNumber(nearest.value)} دستهچک`;
tooltipDate.textContent =
`${nearest.month} ${toPersianNumber(nearest.year)}`;
const leftPercentage = (nearest.x / width) * 100;
const topPercentage = (nearest.y / height) * 100;
tooltip.style.left = `${Math.min(87, Math.max(13, leftPercentage))}%`;
tooltip.style.top = `${Math.max(20, topPercentage)}%`;
stage.classList.add(“is-hovering”);
}
overlay.addEventListener(“mousemove”, move);
overlay.addEventListener(“touchstart”, move, {
passive: true
});
overlay.addEventListener(“touchmove”, move, {
passive: true
});
overlay.addEventListener(“mouseleave”, () => {
stage.classList.remove(“is-hovering”);
});
overlay.addEventListener(
“touchend”,
() => {
window.setTimeout(() => {
stage.classList.remove(“is-hovering”);
}, 1000);
},
{ passive: true }
);
}
function startAnimation() {
if (animationStarted) return;
animationStarted = true;
if (!linePath) return;
if (
window.matchMedia(“(prefers-reduced-motion: reduce)”).matches
) {
linePath.style.strokeDashoffset = “0”;
return;
}
const lineLength = linePath.getTotalLength();
linePath.style.strokeDasharray = `${lineLength}`;
linePath.style.strokeDashoffset = `${lineLength}`;
linePath.getBoundingClientRect();
linePath.style.transition =
“stroke-dashoffset 2s cubic-bezier(.2,.72,.2,1)”;
linePath.style.strokeDashoffset = “0”;
}
draw();
const observer = new IntersectionObserver(
entries => {
if (entries[0].isIntersecting) {
startAnimation();
observer.disconnect();
}
},
{ threshold: 0.2 }
);
observer.observe(root);
let resizeTimer;
const resizeObserver = new ResizeObserver(() => {
clearTimeout(resizeTimer);
resizeTimer = window.setTimeout(draw, 120);
});
resizeObserver.observe(stage);
});
})();
بر این اساس، نزدیک به ۲۷ درصد از دستهچکهایی که در خردادماه برای اشخاص حقیقی صادر شده، الکترونیکی بوده و حدود ۷۳ درصد باقیمانده همچنان در قالب دستهچک کاغذی در اختیار مشتریان قرار گرفته است.
دادههای منتشرشده از سوی بانک مرکزی، تعداد چکها و دستهچکهای الکترونیک صادرشده را نشان میدهد؛ با این حال، در این گزارش آماری اطلاعاتی درباره مبلغ چکهای الکترونیک، تعداد کاربران فعال، نرخ وصول، میزان برگشت یا سهم بانکهای مختلف از صدور این ابزار منتشر نشده است.