[ABI 5.1] 气泡图动态数据切换展示

7294
4

张稀赫 初学数据Lv2

发表于2019-10-23 10:41

悬赏10

已解决

楼主
怎么样,他可以查询数据所有的数据,比如说,我数据库里有2016,2017,2018年数据,然后呢,用到某一个组件,或者代码,可以让他动态切换,就是说,他查出来之后,图上或者某个组件,写着2016,2017,2018,然后刚开出查出来,是2016的,然后过几秒就变成2017,数据也是跟着变得

最近看过此主题的会员

esen_4Y3L5ADO80

esen_4ZBQ38OLTU

养蚯蚓吃沙漠

最佳答案
在报表模板中添加如下脚本:
var chartID = 'HHH370'; //地图统计图的ID
var highcolor = "red"; //地图统计图高亮块的颜色
var idx = 0;
var city = [];
var init = setInterval(function(){
    if(!g_rptpage.chartMng.getChartById(chartID) || !g_rptpage.chartMng.getChartById(chartID).thirdchart){
        return;
    }
    var temp = g_rptpage.chartMng.getChartById(chartID).thirdchart._option.series[1].data;
    temp.forEach(function(item,idx){
        city.push(item.name);
    });
    renderchart();
    clearInterval(init);
},300);
setInterval(renderchart,3000);
function renderchart(){
    var myChartMgr = g_rptpage.chartMng.getChartById(chartID);  
    if(!myChartMgr || !myChartMgr.thirdchart){
        return;
    }
    var myChart = myChartMgr.thirdchart;
    myChart.component.tooltip.hideTip();
    var _series = myChart._option.series;
    var url = _series[1].data[idx].url;
    var currentname = _series[1].data[idx].name;
    _series[1].data = _series[1].data.map(function(item, index){
        item.itemStyle.normal.color = "rgba(192,192,192,1.0)";
        return item;
    })
    _series[1].data[idx++].itemStyle.normal.color = highcolor;
     
    if(idx >= _series[1].data.length){
        idx = 0;
    }
    var option = {
        series: _series
    }
    myChart.setOption(option);
    if(city.indexOf(currentname)>-1){
        myChart.component.tooltip.showTip({ seriesIndex: 1, name:currentname});
    }
     
    if(url){
        eval(url);
    }
}

修改脚本中的配置,如下图所示:
1)、修改统计图地图组件在报表中具体的id。
2)、修改提示信息自动切换、热区自动刷新的间隔时间。(定时执行时间间隔不能过短,否则可能出现获取不到对象的错误提示)

不知道能不能帮到你{:3_55:}
4个回答

只看楼主

张稀赫 初学数据Lv2

发表于2019-10-23 10:50

只看该作者

取消 关注该作者的回复

沙发

或者有没有别的办法,相似的,

一笑伊人 小试身手Lv3

发表于2019-10-23 10:41

只看该作者

取消 关注该作者的回复

板凳

在报表模板中添加如下脚本:
var chartID = 'HHH370'; //地图统计图的ID
var highcolor = "red"; //地图统计图高亮块的颜色
var idx = 0;
var city = [];
var init = setInterval(function(){
    if(!g_rptpage.chartMng.getChartById(chartID) || !g_rptpage.chartMng.getChartById(chartID).thirdchart){
        return;
    }
    var temp = g_rptpage.chartMng.getChartById(chartID).thirdchart._option.series[1].data;
    temp.forEach(function(item,idx){
        city.push(item.name);
    });
    renderchart();
    clearInterval(init);
},300);
setInterval(renderchart,3000);
function renderchart(){
    var myChartMgr = g_rptpage.chartMng.getChartById(chartID);  
    if(!myChartMgr || !myChartMgr.thirdchart){
        return;
    }
    var myChart = myChartMgr.thirdchart;
    myChart.component.tooltip.hideTip();
    var _series = myChart._option.series;
    var url = _series[1].data[idx].url;
    var currentname = _series[1].data[idx].name;
    _series[1].data = _series[1].data.map(function(item, index){
        item.itemStyle.normal.color = "rgba(192,192,192,1.0)";
        return item;
    })
    _series[1].data[idx++].itemStyle.normal.color = highcolor;
     
    if(idx >= _series[1].data.length){
        idx = 0;
    }
    var option = {
        series: _series
    }
    myChart.setOption(option);
    if(city.indexOf(currentname)>-1){
        myChart.component.tooltip.showTip({ seriesIndex: 1, name:currentname});
    }
     
    if(url){
        eval(url);
    }
}

修改脚本中的配置,如下图所示:
1)、修改统计图地图组件在报表中具体的id。
2)、修改提示信息自动切换、热区自动刷新的间隔时间。(定时执行时间间隔不能过短,否则可能出现获取不到对象的错误提示)

不知道能不能帮到你{:3_55:}

张稀赫 初学数据Lv2

发表于2019-10-23 13:57

只看该作者

取消 关注该作者的回复

地板

一笑伊人 发表于 2019-10-23 11:17
在报表模板中添加如下脚本:
var chartID = 'HHH370'; //地图统计图的ID
var highcolor = "red"; //地图统 ...

好的,谢谢,我试一下

小亿 管理员

发表于2019-10-28 10:59

只看该作者

取消 关注该作者的回复

5#

问题是否有得到解决呢?解决之后可以设置最佳答案关帖哟~

登录后可回答问题,请登录注册

快速回复 返回顶部 返回列表

小时

全天响应

分钟

快速处理问题

工程师强势助力

明星产品
解决方案
联系合作

400咨询:400-0011-866

技术支持QQ:400-0011-866(工作日9:00-18:00)

产品建议邮箱yixin@esensoft.com

关注我们

扫TA学习更多干货

一对一专家交流

版权所有© 2006-2024 北京亿信华辰软件有限责任公司 京ICP备07017321号 京公网安备11010802016281号