地图分析报表,某个区域想突出标记,添加一个图片显示,显示效果如下:
上述功能需要通过宏代码实现:
1.选中地图分析,右键选择 编辑宏 进入报表宏界面。然后在左侧的“客户端模块”上点击鼠标右键,选择“新建模块”菜单项。在出现的“新建模块”对话框上选择对象和事件。如下图所示。
2. 宏代码类型、对象和事件。
类型 | 对象 | 事件 |
---|---|---|
ClientSide | chart | afterRenderer |
3. 在宏代码编辑框中输入如下的代码段。
function main(chartView) { var chart = chartView.getChartObject(), map = chart.getChart(), points = map.series[0].points; //获取所有的区域节点 for (var pi = points.length - 1; pi >= 0; pi--) { var point = points[pi], series = point.series; if (point.image) { //判断区域节点中是否有图片信息 var img = point.image; var imgHeight = parseInt(img.height); var ret = series.translatePath([img.x, img.y + imgHeight]); //获取图片的位置信息 if (!point.mySymbol) { //判断是否已经添加图片 var indexi = img.src.indexOf("vision/"); symbol = "url(" + img.src.substring(indexi + 7) + ")"; //获取具体的图片信息,并转化为地图接收的格式 //添加图片到地图中 point.mySymbol = map.renderer.symbol(symbol, ret[0], ret[1] - imgHeight, img.width, imgHeight).add(series.markerGroup); } else { //如果已经存在图片,则直接移动位置 var ret = series.translatePath([img.x, img.y]); point.mySymbol.animate({ x: ret[0], y: ret[1] }); } break; } } }
宏代码中的图片信息,是在svg地图文件中指定的,示例图形的svg部分代码如下:
注意:img图片的路径是相对于smartbi的vision目录,如下图,文件是在vsion目录下的img目录下。