https://github.com/tengge1/xtype-svg

使用xtype.js封装的svg标签。
https://github.com/tengge1/xtype-svg

progressive svg ui web xtype-js

Last synced: about 1 month ago
JSON representation

使用xtype.js封装的svg标签。

• Host: GitHub
• URL: https://github.com/tengge1/xtype-svg
• Owner: tengge1
• License: mit
• Created: 2018-11-10T04:20:51.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2019-02-25T11:12:59.000Z (over 7 years ago)
• Last Synced: 2025-08-20T10:12:08.514Z (10 months ago)
• Topics: progressive, svg, ui, web, xtype-js
• Language: JavaScript
• Size: 24.4 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# xtype-svg

xtype-svg将常用的svg标签封装为类，可以像ExtJs那样通过javascript动态生成svg文档。

**xtype-svg不保证兼容除最新版`Chrome`以外的其他浏览器。**

使用方法：

```javascript

var dom = XType.SVG.create({

    xtype: 'svg',

    parent: document.body,

    attr: {

        width: 400,

        height: 400,

        viewBox: '0 0 100 100'

    },

    children: [{

        xtype: 'circle',

        attr: {

            cx: 50,

            cy: 50,

            r: 30,

            stroke: '#555',

            'stroke-width': 2,

            fill: '#f00'

        },

        listeners: {

            click: () => {

                alert('You clicked!');

            }

        }

    }]

});

dom.render();

```

具体用法请参照[xtype.js](https://github.com/tengge1/xtype.js)使用说明。

## 依赖项

无。已包含`xtype.js`。

## 安装方法

```

npm install @tengge1/xtype-svg

```

## 核心函数

`Control`: 所有控件基类

`SVG`：用于svg控件的创建和管理。

请阅读[xtype.js](https://github.com/tengge1/xtype.js)了解每个类的使用方法。

## 相关链接

* xtype.js: https://github.com/tengge1/xtype.js