You can click idraw.js.org/studio/ to experience it.
The preview of @idraw/studo.
npm install antd
npm install @idraw/studio;import * as React from 'react';
import ReactDOM from 'react-dom';
import Studio from '@idraw/studio';
import '@idraw/studio/dist/css/index.css'
ReactDOM.render(
(<Studio {...{
studioWidth: window.innerWidth,
studioHeight: window.innerHeight,
contextWidth: 800,
contextHeight: 600,
data: { elements: [] }
}}></Studio>),
document.querySelector('#app')
){
studioWidth?: number;
studioHeight?: number;
contextWidth?: number;
contextHeight?: number;
devicePixelRatio?: number;
data?: TypeDataBase | TypeData;
customMaterials?: TypeMaterial[];
customMaterialsPagination?: {
current: number;
pageSize: number;
total: number;
onChange: (currentPage: number) => void;
};
customTemplates?: TypeTemplate[];
customTemplatesPagination?: {
current: number;
pageSize: number;
total: number;
onChange: (currentPage: number) => void;
};
onChange?: (data: TypeData) => void;
}git clone git@github.com:idrawjs/studio.git
cd studio
npm install
npm run dev