import React from 'react';
import styles from './BannerSVG.module.less';
const BannerSVG = React.memo(() => {
const block6NodeRadius = '2';
const block6GridPositions = [
{ x: 45.5, y: 45.5 }, // A
{ x: 65.5, y: 45.5 }, // B
{ x: 85.5, y: 45.5 }, // C
{ x: 105.5, y: 45.5 }, // D
{ x: 45.5, y: 65.5 }, // E
{ x: 65.5, y: 65.5 }, // F
{ x: 85.5, y: 65.5 }, // G
{ x: 105.5, y: 65.5 }, // H
{ x: 45.5, y: 85.5 }, // I
{ x: 65.5, y: 85.5 }, // J
{ x: 85.5, y: 85.5 }, // K
{ x: 105.5, y: 85.5 }, // L
{ x: 45.5, y: 105.5 }, // M
{ x: 65.5, y: 105.5 }, // N
{ x: 85.5, y: 105.5 }, // O
{ x: 105.5, y: 105.5 }, // P
];
const fills = [
'rgb(180, 100, 254)', // A
'rgb(163, 89, 254)', // B
'rgb(141, 76, 254)', // C
'rgb(120, 64, 254)', // D
'rgb(205, 114, 254)', // E
'rgb(185, 103, 254)', // F
'rgb(159, 87, 254)', // G
'rgb(140, 78, 254)', // H
'rgb(224, 126, 254)', // I
'rgb(202, 114, 254)', // J
'rgb(179, 100, 254)', // K
'rgb(164, 92, 254)', // L
'rgb(248, 141, 254)', // M
'rgb(223, 126, 254)', // N
'rgb(201, 112, 254)', // O
'rgb(180, 101, 254)', // P
];
const getBlock6Circles = () => {
const labels = [
'A',
'B',
'C',
'D',
'E',
'F',
'G',
'H',
'I',
'J',
'K',
'L',
'M',
'N',
'O',
'P',
];
const circles = labels.map((label, i) => {
const beginx = block6GridPositions[i].x;
const beginy = block6GridPositions[i].y;
const classname = `block6Circle${label}`;
return (
);
});
return circles;
};
return (
);
});
export default BannerSVG;