第一次使用HTML5View
工程师：我之前的所有报表都是通过FlashViewer呈现的，今天第一次尝试将FlashViewer逐步替换为HTML5View。按照教程一步一步操作，但是总是失败，提示“报表不可用”
烦请告知问题出在哪里？附件为报表文件。
1. 首先一个页面先去除FlashViewer，因为FlashViewer可能内部包含js文件，与HTML5Viewer的js版本不一致发生冲突。
2. 检查报表路径是否正确。
3. 确css，fonts ，把html5viewer本地示例中的css文件夹和fonts文件夹，Scripts文件夹都拷贝到您的工程中。<link href="css/theme-cosmo.css" rel="stylesheet">
<link href="css/site.css" rel="stylesheet">
<link href="css/GrapeCity.ActiveReports.Viewer.Html.css" rel="stylesheet">
<script src="Scripts/jquery-1.10.2.js"></script>
<script src="Scripts/bootstrap-3.0.0.js"></script>
<script src="Scripts/knockout-2.3.0.js"></script>
<script src="Scripts/GrapeCity.ActiveReports.Viewer.Html.js"></script>
小篮子，你有没有下载我的附件测试呢？ wu8829 发表于 2016-11-23 10:51
小篮子，你有没有下载我的附件测试呢？
下载了，您的一个页面，是缺少了很多文件哦。 通过多种测试发现原因所在，但有如下几个问题需要解决：
【View.aspx 为HTML5View所在页面，WorkAttendance_Report.rdlx为报表文件。此两个文件位于同一目录下。】
1、所有的教程中，都是在HTML文件中设置HTML5View，但我的是aspx文件。如果我按照教程中的script写，例如：
<script type="text/javascript">
$(function () {
var viewer = GrapeCity.ActiveReports.Viewer(
{
element: '#viewer',
report: {
id: 'WorkAttendance_Report.rdlx',
parameters:[
{
name: 'Work_User',
value:'吴超'
},
{
name: 'Work_Month',
value:'10'
}
]
},
selectedReportIndex: 0,
reportService: {
url: '/ActiveReports.ReportService.asmx'
},
uiType: 'desktop',
documentLoaded: function reportLoaded() {
console.log(viewer.pageCount);
},
reportLoaded: function (reportInfo) {
console.log(reportInfo.parameters);
},
error: function (error) {
console.log("error");
}
});
});
</script>
报表无法呈现，会报下图错误：
期初不知道是哪里的问题，通过几次测试时报表引用路径的问题，但不知如何表述，所以目前暂时改为电脑绝对路径，如下：
$(function () {
var viewer = GrapeCity.ActiveReports.Viewer(
{
element: '#viewer',
report: {
id: 'F:\\云同步文件\\MyProgram\\ERP_2013\\ERP_2013\\RunSheet\\WorkAttendance_Report.rdlx',
parameters:[
{
name: 'Work_User',
value:'吴超'
},
{
name: 'Work_Month',
value:'10'
}
]
},
selectedReportIndex: 0,
reportService: {
url: '/ActiveReports.ReportService.asmx'
},
uiType: 'desktop',
documentLoaded: function reportLoaded() {
console.log(viewer.pageCount);
},
reportLoaded: function (reportInfo) {
console.log(reportInfo.parameters);
},
error: function (error) {
console.log("error");
}
});
});
至此，报表可以正常预览。
2、报表虽然可以正常预览，但与报表本质的设计有区别，如图：
预览时，却是：
可以很明显看出：表标题无法完全正常显示，不知是何原因，点击打印按钮后，出现的预览又正常：
简而言之，需要解决两个问题：
1、aspx页面中，报表文件路径引用问题；
2、报表呈现有差异 到目前为止，我还没发现HTML5View比FlashView的好处，感觉没多大差别，而且还要引用一大堆css、js wu8829 发表于 2016-11-23 19:47
简而言之，需要解决两个问题：
1、aspx页面中，报表文件路径引用问题；
2、报表呈现有差异
您好
1. 将报表放在与页面同意目录下， 然后把id 直接写成报表名称。或是使用~\表示项目根目录，~\报表文件夹\报表名称
2. 报表标题，可能是有其他的标签覆盖了，所以导致未显示完全，需要调整报表设计样式。 1、按照您的方法依然提示“报表不可用”。
2、如果是其他标签覆盖了，那怎么在FlashView里又没这样的错误？另外，报表文件在压缩包内，您可以去核实，并未存在多余标签覆盖的问题 本帖最后由 Lenka.Guo 于 2016-11-24 15:41 编辑
1.按照您的方法依然提示“报表不可用”。
》》》 报表不可用，说明路径还没有正确或者需要报表文件的copy Local 属性设置为True。
2. 我在这边只修改了报表数据源，使用HTML5Viewer 加载，展示正常：
》》》不同的报表浏览器是为适应和解决不同平台和技术提供的，因此渲染报表也是采用对应技术，如HTML5Viewer使用的是HTML5技术和Bootsrap等，而FlashViewer 则采用的是浏览器的Flash技术来展示报表等，所以每种浏览器因为采用的技术不同，渲染报表的效果也是有略微差异的。而且每一种报表浏览器没有绝对的好坏哦，只是看选择哪一种更能满足您的技术和实现需求哦。
页:
[1]
2