拉斐尔 Angular 4+
Raphael with Angular 4+
我正在尝试添加 Raphael to an Angular 4+ project. I have no idea where to start. Ideally I would want it added with types and all. I have looked at 但没成功。
使用 angular CLI 的分步指南会很棒！
使用 Angular + Raphael 和类型设置示例项目的分步指南。
- 使用 angular CLI 创建一个 angular 项目
ng new raphael-sampel
- 在项目中安装 Raphael
npm install raphael
- 安装 Raphael 类型
npm install --save @types/raphael
- 将app.component.html中的HTML内容替换为
<div id="paper"></div>
- 将拉斐尔导入 app.component.ts
import * as Raphael from 'raphael';
在 app.component.ts 中实现 OnInit（见下文）
<br>
从'@angular/core'导入{组件，OnInit}；
从 'raphael';</p> 导入 * 作为拉斐尔
<p>@组件({
选择器：'app-root'，
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
导出 class AppComponent 实现 OnInit
{
ngOnInit(): 无效
{
let paper = Raphael(document.getElementById('paper'), 500, 500);<br>
paper.circle(100, 100, 100).attr({'fill':'270-#FAE56B:0-#E56B6B:100'});<br>
}
}
我正在尝试添加 Raphael to an Angular 4+ project. I have no idea where to start. Ideally I would want it added with types and all. I have looked at
使用 angular CLI 的分步指南会很棒！
使用 Angular + Raphael 和类型设置示例项目的分步指南。
- 使用 angular CLI 创建一个 angular 项目
ng new raphael-sampel - 在项目中安装 Raphael
npm install raphael - 安装 Raphael 类型
npm install --save @types/raphael - 将app.component.html中的HTML内容替换为
<div id="paper"></div> - 将拉斐尔导入 app.component.ts
import * as Raphael from 'raphael'; 在 app.component.ts 中实现 OnInit（见下文）
<br> 从'@angular/core'导入{组件，OnInit}； 从 'raphael';</p> 导入 * 作为拉斐尔 <p>@组件({ 选择器：'app-root'， templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) 导出 class AppComponent 实现 OnInit { ngOnInit(): 无效 { let paper = Raphael(document.getElementById('paper'), 500, 500);<br> paper.circle(100, 100, 100).attr({'fill':'270-#FAE56B:0-#E56B6B:100'});<br> } }