/
alt3rmann
/
label-studio
Обзор
Документация
Войти
/
alt3rmann
/
label-studio
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
Безопасность
develop
web/libs/editor/src/components/ImageGrid/ImageGrid.jsx
53 строки
1 KB
yyassi-heartex
chore: OPTIC-1154: biome linting tweaks (#6425)
22 окт 2024, 23:22
Не верифицирован
22 окт 2024, 23:22
7ed55c6
Код
Авторство
О чём код?
import { Component } from "react"; import { observer } from "mobx-react"; import { Layer, Rect } from "react-konva"; /** * Create grid for Image Canvas * @param {number} width * @param {number} height * @param {number} nodeSize */ const createGrid = (width, height, nodeSize) => { return [...Array(width)] .map((_, col) => [...Array(height)].map((_, row) => ({ col, row, x: col * nodeSize, y: row * nodeSize, fill: "#fff", })), ) .reduce((p, c) => [...p, ...c]); }; export default observer( class ImageGrid extends Component { render() { const { item } = this.props; const grid = createGrid( Math.ceil(item.stageWidth / item.gridsize), Math.ceil(item.stageHeight / item.gridsize), item.gridsize, ); return ( <Layer opacity={0.15} name="ruler"> {Object.values(grid).map((n, i) => ( <Rect key={i} x={n.x} y={n.y} width={item.gridsize} height={item.gridsize} stroke={item.gridcolor} strokeWidth={1} /> ))} </Layer> ); } }, );