NO.030-记录一次特殊图表类型的数据获取！———By.杭州组

作者：芬达

关键词：图表数据获取

一.问题背景

       客户需要获取的地图图表数据，但是通过网页监听也无法获取到，目前市场指令只支持获取柱状图、饼状图和折线图类型的数据。因此，对于地图类型的数据，我们可以结合XPath和影刀市场的跨域指令来获取。

二、解决方法

1.XPath介绍：

       有关XPath的介绍已经有小伙伴整理过啦，感兴趣的可以直接参考这个链接：xpath&影刀日常场景元素捕获 ——by.广州业务组-应用设计交流-影刀RPA开发者社区

2.常规方法：

先介绍下常规方法

参考示例网站：巨量算数

xpath-helper插件下载路径：https://chrome.zzzmh.cn/info/hgimnogjllphhhkhlmebbmlgjoejdpjl

对于这一类鼠标移动上去才显示数据的元素，通过影刀的悬浮捕获无法捕获该元素，通常的做法是采取网页监听拿到数据，今天我们介绍另一种方式，模拟人工移动，通过XPath定位悬浮框拿到该元素。

操作实例：

       F12打开控制面板，然后选择网页中的元素进行检查，移动鼠标会发现悬浮框变化的同时，右侧的div也在变化，说明这个div就是我们要找的悬浮框元素，右键复制XPath路径，然后通过XPath-helper插件，检查该路径是否能选中悬浮框。

后面的步骤就是通过该XPath路径获取该元素对象，获取元素文本即可获得悬浮框内容。

整体的流程让鼠标从X轴左端滑动到右端，在滑动过程中获取悬浮框内容。

实例流程如下：

3.跨域+XPath方法：

这里面我们借助了市场里已经有的指令：

       通常情况下，我们可以通过拷贝元素的XPath来直接定位到普通网页上的元素。但是在这个特殊的网页中，我们无法通过拷贝省份元素的XPath来直接定位到它。

       在这种情况下，我们只能获取到最上层的svg元素的XPath，而无法直接获取到包含每个省份的元素。但是我们知道每个省份都位于这个div元素的第二个子元素中。因此，我们可以通过定位到最上层的svg元素的XPath，再往下找到这个div元素的第二个子元素，从而获取到所有省份的相似元素。

      然后我们可以使用 (//div[@class="full-screen olap-chart-box"])[last()]/*/*[2]/* 这个XPath表达式来定位到这个div的第二个子元素，从而获取到所有省份的相似元素。

现在，让我们逐个解释这个表达式中的每个符号：

(//div[@class="full-screen olap-chart-box"])：这部分表示我们要查找的元素是 div，并且具有 class 属性值为 "full-screen olap-chart-box"。// 表示在整个文档中搜索，而不仅仅是当前节点的子节点。

[last()]：这部分表示我们只选择匹配的元素中的最后一个。也就是说，我们只选择最后一个具有指定 class 属性值的 div 元素。

/*：表示我们选择匹配元素的所有直接子元素。

/*[2]：表示我们从上一步选择的直接子元素中，只选择第二个直接子元素。

/*：表示我们选择第二个直接子元素的所有直接子元素。

通过这种方式，我们就获取到了所有省份的相似元素啦

实现流程如下：