多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
路径:D:\ireport365\ireport365.war\js\enduser\designer\vs-component-widget-grid.js ~~~ d3.G1000 = function (param) { } ~~~ 在上面的函数里面写下面函数 ~~~ // 计时器标记 var MyMarhq; this.tableScroll = function (_option,speed, len) { clearTimeout(MyMarhq); var tblTop = 0; // var container = d3.select(dom); // var gbody =container.select("table.gbody"); // gbody.selectAll("tr") // console.log(gbody.selectAll("tr").length) if(_option.IstableScroll){ // console.log(_option.data) // console.log(_option.rowHeight) function Marqueehq() { if (tblTop <= -_option.rowHeight * len) { tblTop = 0; } else { tblTop -= 1; } gbody.style({ 'margin-top':tblTop+'px' }); clearTimeout(MyMarhq); MyMarhq = setTimeout(function() { Marqueehq() }, speed); } MyMarhq = setTimeout(Marqueehq, speed); $('.gbody').hover(function() { clearTimeout(MyMarhq); }, function() { if(_option.IstableScroll){ clearTimeout(MyMarhq); MyMarhq = setTimeout(Marqueehq, speed); }else{ tblTop = 0; clearTimeout(MyMarhq); } }) }else{ gbody.style({ 'margin-top':'0px' }); } } ~~~ 在这个函数的下面调用上面的函数 ![](https://box.kancloud.cn/6e414111b6ec505d8b5f853ec674c7d3_831x426.png) ~~~ // 调用 setTimeout(function () { s.context.chart.tableScroll(s.config.chartConfig,30,s.config.chartConfig.IstableScrollLen) }, 100) ~~~ 在构建配置面板的函数里写标体滚动的配置 ~~~ p.groups.push({ name: "", title: { text: "表体滚动" }, elements: [{ title: "开启-关闭", type: "switch", bind: "istableScroll", on: vsLang.on, off: vsLang.off }] }); t.$watch("component.config.istableScroll", function (w, u) { // console.log(w) // console.log(u) var p = o.config.chartConfig; if (w != null && w) { p.IstableScroll = true; var len = o.context.data.length // console.log(len) p.IstableScrollLen = len; // option 速度 数据个数 o.context.chart.tableScroll(p,30,p.IstableScrollLen) // t.$broadcast(event_refreshChartView, {}) }else{ p.IstableScroll = false; p.IstableScrollLen = 0; o.context.chart.tableScroll(p,30,p.IstableScrollLen) // t.$broadcast(event_refreshChartView, {}) } }); ~~~ 路径:D:\ireport365\ireport365.war\WEB-INF\classes\report-resource\design.js 在此处加这个滚动函数并且调用 ![](https://box.kancloud.cn/1919cda34b8285a82e8164be9ca6d585_928x587.png) ~~~ var MyMarhq; component.context.tableScroll = function (_option,speed, len) { clearTimeout(MyMarhq); var tblTop = 0; if(_option.IstableScroll){ // console.log(_option.rowHeight) function Marqueehq() { if (tblTop <= -_option.rowHeight * len + body.height() ) { tblTop = 0; } else { tblTop -= 1; } gbody.css({ 'margin-top':tblTop+'px', }); body.css({ 'overflow':'hidden', // 'overflow-x':'hidden', 'overflow-y':'hidden' }); clearTimeout(MyMarhq); MyMarhq = setTimeout(function() { Marqueehq() }, speed); } MyMarhq = setTimeout(Marqueehq, speed); $('.gbody').hover(function() { clearTimeout(MyMarhq); }, function() { clearTimeout(MyMarhq); MyMarhq = setTimeout(Marqueehq, speed); }) } }; // console.log(component.context) // 调用 setTimeout(function () { var len = gbody.find('tr').length; component.context.tableScroll(component.config.chartConfig,30,len) }, 100) ~~~