页面树结构
转至元数据结尾
转至元数据起始

提示:本文档的示例代码仅适用于本文档中的示例报表/场景。若实际报表/场景与示例代码无法完全适配(如使用功能不一致,或多个宏代码冲突等),需根据实际需求开发代码。

说明

现需要让地图(染色地图或者散点地图)还需要显示没有勾选的字段值,效果如下:


思路

1.该地图的数据集中,必须包含区域字段(此宏代码的针对区域标识制作地图写的,若是需要使用经纬度作图并生效,需修改自行修改代码),如下:

2.使用以上数据集创建地图(染色地图\散点图),如下:

 

3.在该地图上新建客户端宏模块

类型:客户端      对象:chart       事件:beforeRenderer

5.复制并根据实际情况修改以下宏代码

function main(chartView) {
    //设置需要显示的指标,不填则显示所有数据集中的指标,样式 ['商品名称','销售额'] 不填则为 []
    var showFields = [];
    var chart = chartView.getChartObject();
    var gridData = chartView.getGridData();
    console.log(gridData);
    var options = chart.getOptions();
    var param = gridData.data;
    var fields = gridData.fields;
    options.tooltip.formatter = function(params,ticket,callback){
        var res =params.name;
        console.log(params);
        for (var i = 0, l = param.length; i < l; i++) {
            for(var j=0;j<param[i].length;j++){
                //console.log(param[i][j].value);
                if((param[i][j].value+"").indexOf(params.name)>-1){
                    for(m=0,n=param[i].length;m<n;m++){
                        if(isInArray(showFields,fields[m].alias)){
                            res += '<br/>' + fields[m].alias + ' : ' + param[i][m].value;
                        }
                    } //调整m值的大小可控制鼠标提示显示几个值
                    break;
                }
            }
        }
           
        return res;
    }
    
}
function isInArray(arr,value){
    if(arr===null || arr.length===0){
        return true;
    }
    for(var i = 0; i < arr.length; i++){
        if(value === arr[i]){
            return true;
        }
    }
    return false;
}


5.效果图如下

示例资源,基于northwind数据库:地图鼠标提示显示多个值.xml

  • 无标签