创建纯JS代码APP应用程序新的HTML页面
arjs报告设计器引用报告的js库
rel='stylesheet '
href=' https://cdn.grapecity.com/activereports js/2.latest/styles/ar-js-ui.CSS '
type='text/css '
/
rel='stylesheet '
href=' https://cdn.grapecity.com/activereports js/2.latest/styles/ar-js-designer.CSS '
type='text/css '
/
将报表设计器主体元素添加到HTML页
将designer-host元素添加到头标签
#designer-host {
边距： 0自动；
width: 100%；
height: 100vh；
}
添加JSON格式的报告
ActiveReportsJS使用JSON格式和rdlx-json扩展来用于报告模板文件。 在APP应用程序的根目录下，创建一个名为report.rdlx-json的新文件，并将以下JSON的内容插入该文件中： {
' Name': 'Report '，
' Body': {
' ReportItems': [
{
“Type': 'textbox”表示，
“Name': 'TextBox1”为、
' Value': 'Hello，ActiveReportsJS Viewer '，
' Style': {
' FontSize': '18pt '
(，
' Width': '8.5in合'，
' Height': '0.5in '
}
]
}
}初始化设计师
在body标签中，在designer-host元素之后添加脚本标签
var designer=new GC.activereports.report designer.designer (' # designer-host ' )；
e signer.set report ({ id : ' report.rdlx '，displayName: 'my report'} )；
运行和测试APP应用程序
使用浏览器打开HTML页面并查看运行结果。