【嵌入式分析】纯JS结构的项目中div集成报表
本帖最后由 Bella.Yuan 于 2023-12-1 16:29 编辑在 Wyn7.0 版本之后,div集成的方式有了优化,首先报表和仪表板不用再分开集成;其次,仪表板集成不用再引入 Wyn 服务的插件。帮助我们更方便的进行集成。但是目前只发布了通过npm依赖的方式进行集成。我们今天介绍如何在纯JS项目中集成报表和仪表板。
1. 下载依赖文件
先找一个项目通过 npm 的方式下载 wyn 的依赖文件:npm install @grapecity/wyn-integration
2. 把下载的 node_modules 依赖文件全部拷贝到我们的新的项目中
3. 引入依赖文件,编写集成代码
<script type="text/javascript" src="./node_modules/@grapecity/wyn-integration/build/WynIntegration.js"></script>
<script>
// 集成报表查看器
window.viewerInstance = null;
WynIntegration.WynIntegration.createReportViewer({
baseUrl: 'http://localhost:51980/',
token: '9D2E6BB2A5AC05EAB95B0CB573E571EFFD64E33E3BF4A25C8E2821A7FF657842',
reportId: '12d578ad-535e-4b30-9f04-237399a2ae8a',
}, '#wyn-root').then(function (ins) {
window.viewerInstance = ins;
});
</script>
4. 启动项目,查看效果
5. 其他模块集成说明
js 集成文问题难点在于如何绕过 npm 框架引入、使用资源文件,按照前面的方式获取、引入即可。代码的集成和编写方式与 npm 提供的集成方式一致。可以 在 npm官网上查看:https://www.npmjs.com/package/@grapecity/wyn-integration
页:
[1]