62 lines
2.5 KiB
JavaScript
62 lines
2.5 KiB
JavaScript
// shapes.js
|
|
const shapes = [
|
|
{
|
|
id: 'square',
|
|
name: '正方形',
|
|
svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<rect x="5" y="5" width="90" height="90" fill="var(--fill-color)" stroke="black" stroke-width="2"/>
|
|
</svg>`,
|
|
},
|
|
{
|
|
id: 'diamond',
|
|
name: '菱形',
|
|
svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<polygon points="50,5 95,50 50,95 5,50" fill="var(--fill-color)" stroke="black" stroke-width="2"/>
|
|
</svg>`,
|
|
},
|
|
{
|
|
id: 'cylinder',
|
|
name: '圆柱体',
|
|
svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<rect x="20" y="40" width="60" height="50" rx="5" ry="5" fill="var(--fill-color)" stroke="black" stroke-width="2"/>
|
|
<ellipse cx="50" cy="40" rx="30" ry="10" fill="var(--fill-color)" stroke="black" stroke-width="2"/>
|
|
<ellipse cx="50" cy="90" rx="30" ry="10" fill="var(--fill-color)" stroke="black" stroke-width="2" style="opacity:0.7"/>
|
|
</svg>`,
|
|
},
|
|
{
|
|
id: 'cube',
|
|
name: '立方体',
|
|
svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<polygon points="20,30 50,10 80,30 50,50" fill="var(--fill-color)" stroke="black" stroke-width="2" opacity="0.9"/>
|
|
<polygon points="50,50 80,30 80,70 50,90" fill="var(--fill-color)" stroke="black" stroke-width="2" opacity="0.7"/>
|
|
<polygon points="20,30 20,70 50,90 50,50" fill="var(--fill-color)" stroke="black" stroke-width="2" opacity="0.8"/>
|
|
</svg>`,
|
|
},
|
|
{
|
|
id: 'circle',
|
|
name: '圆形',
|
|
svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<circle cx="50" cy="50" r="40" fill="var(--fill-color)" stroke="black" stroke-width="2"/>
|
|
</svg>`,
|
|
},
|
|
{
|
|
id: 'sphere',
|
|
name: '球体',
|
|
svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<circle cx="50" cy="50" r="40" fill="var(--fill-color)" stroke="black" stroke-width="2" style="opacity:0.9"/>
|
|
<ellipse cx="50" cy="50" rx="30" ry="10" fill="var(--fill-color)" stroke="black" stroke-width="2" style="opacity:0.7"/>
|
|
</svg>`,
|
|
},
|
|
];
|
|
|
|
// 颜色选项
|
|
const colors = [
|
|
{ name: '红色', value: '#ff5252' },
|
|
{ name: '蓝色', value: '#448aff' },
|
|
{ name: '绿色', value: '#69f0ae' },
|
|
{ name: '黄色', value: '#ffd740' },
|
|
{ name: '紫色', value: '#e040fb' },
|
|
];
|
|
|
|
export { shapes, colors };
|