提示

可视化全埋点在神策分析上的使用，可以参考可视化全埋点

1. Android 端

版本要求

Android SDK v4.0.0 及以上版本

1.1. 配置 scheme

在 AndroidManifest.xml 中 MainActivity 的标签内，配置项目 scheme。

<!-- Android 12 需添加 android:exported="true"-->
<activity android:name="com.sensorsdata.analytics.android.sdk.dialog.SchemeActivity"
android:configChanges="orientation|screenSize"
android:exported="true"
android:launchMode="singleTask">
        <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.BROWSABLE" />
                <category android:name="android.intent.category.DEFAULT" />
                <data android:scheme="您项目的 scheme" />
        </intent-filter>
</activity>
XML

1.2. 开启可视化全埋点

SDK 初始化前设置 SAConfigOptions 配置时，调用 enableVisualizedAutoTrack(true) 方法开启可视化全埋点

// 开启可视化全埋点
saConfigOptions.enableVisualizedAutoTrack(true);
JAVA

1.3. 可视化全埋点自定义属性

版本要求

Android SDK v6.0.0 及以上版本

SA 开启 SDG 且 SDG 的版本 v0.10.0.134 以上

Edge 版本号：0.2.9882

注意事项：

如果您需要使用可视化全埋点自定义属性，需要配置 enableVisualizedProperties: true

// 开启可视化全埋点自定义属性配置下发
saConfigOptions.enableVisualizedProperties(true);
CODE

此属性为 false 的情况下，创建的可视化自定义属性无法采集。

2. iOS 端

  • 本功能需要 iOS SDK 为 v2.0.0 及以上版本
  • 功能开启前，请确保您 iOS 项目中已完成配置 Scheme

SDK 初始化前，将 SAConfigOptions 的 enableVisualizedAutoTrack 属性设置为 YES，即可开启可视化全埋点

// 开启可视化全埋点
options.enableVisualizedAutoTrack = YES;
OBJECTIVE-C

2.1. 可视化全埋点自定义属性

版本要求

  • iOS SDK v4.0.0 及以上版本
  • SA 开启 SDG 且 SDG 的版本 v0.10.0.134 以上
  • Edge 版本号：0.2.9882

注意事项：

如果您需要使用可视化全埋点自定义属性，需要配置 enableVisualizedProperties: 

// 开启可视化全埋点自定义属性配置下发
options.enableVisualizedProperties = YES;
CODE

此属性为 false 的情况下，创建的可视化自定义属性无法采集。

3. React Native App

版本要求

  • React Native 0.46 ~ 0.66
  • React Native SDK v2.0.1 及以上版本
  • Android SDK v4.1.1 及以上版本
  • Android 插件 v3.2.5 及以上版本
  • iOS SDK v2.0.10 及以上版本

集成神策 React Native SDK 的 App，只需要原生端开启可视化全埋点功能，即可自动支持 React Native 的页面和控件。

3.1. 可视化全埋点自定义属性

版本要求

  • iOS SDK v4.0.0 及以上版本
  • Android v6.0.0 及以上版本
  • SA 开启 SDG 且 SDG 的版本 v0.10.0.134 以上
  • Edge 版本号：0.2.9882

注意事项：

如果您需要使用可视化全埋点自定义属性，需要配置 enableVisualizedProperties: 

Android 端：
// 开启可视化全埋点自定义属性配置下发
saConfigOptions.enableVisualizedProperties(true);
iOS 端：
// 开启可视化全埋点自定义属性配置下发
options.enableVisualizedProperties = YES;
CODE

此属性为 false 的情况下，创建的可视化自定义属性无法采集。

4. Web 端

4.1. 开启可视化全埋点

版本要求

  • Web JS SDK v1.15.10 及以上版本
  • Web JS SDK v1.15.27 及以上版本，需要 SA 开启 SDG 且 SDG 的版本 v0.7.4 以上

在集成 Web JS SDK 后，如果开启了全埋点功能，则可视化全埋点功能也会自动开启，仅限于对 a、input、button 、textarea 和 div 元素进行可视化全埋点。

注意事项：

  1. div 元素的可视化全埋点需要 Web JS SDK v1.15.15 及以上版本；
  2. div 元素的可视化全埋点需要为叶子节点；
  3. div 元素的叶子节点全埋点自动采集，需要通过 collect_tags 配置开启（具体规则可参考：全埋点支持 div 采集）。

4.2. 可视化全埋点支持其他元素类型

版本要求

Web JS SDK v1.18.4 及以上版本

heatmap:{  
		// 配置任意类型元素支持可视化
        collect_tags:{
             div: {
       			 max_level: 1 // 默认是 1，即只支持叶子 div。可配置范围是 [1, 2, 3],非该范围配置值，会被当作 1 处理。
   			 },
   			 li: true,
    		 img: true,
             svg: true
        }
		// 配置自定义属性支持可视化
		track_attr: ['hotrep', 'anotherprop', "data-prop2"],
}

// 配置自定义属性支持可视化 - dom 示例
<p hotrep id="test1">hotrep p tag</p>
<p><span anotherprop id="test2">another repo a.b.c</span></p>
<p><strong data-prop2 id="test3">strong with prop2 attribute</strong></p>

// data-sensors-click 指定元素支持可视化
<div name='test' data-sensors-click> <p>我是测试元素</p></div>
CODE

4.3. 可视化全埋点自定义属性 & 任意层级 div

版本要求

  • Web JS SDK v1.18.4 及以上版本
  • SA 开启 SDG 且 SDG 的版本 v0.10.0.134 以上
  • Edge 版本号：0.2.9882

注意事项：

如果您需要使用可视化自定义属性，配置 get_vtrack_config : true 即可，配置项位置示例如下：

	...
	sdk_url: '在 github 下载新版本的 sensorsdata.min.js ',
    name: 'sensors',
    server_url:'数据接收地址',
    heatmap: {
        //是否开启点击图，默认 default 表示开启
        clickmap:'default',
        //是否开启可视化自定义属性，默认为 true，表示开启，可以设置为 false 关闭
        get_vtrack_config: true
    }
	...
CODE

此属性为 false 的情况下：

  1. SDK 埋点数据不会添加可视化创建的自定义属性
  2. Web 可视化无法使用自定义属性功能
  3. Web 可视化不支持任意层级 div

4.4. 截图功能

版本要求

  • 神策分析 v1.17.3374 及以上版本或 v2.0.3411 及以上版本
  • Web JS SDK v1.15.10 及以上版本

可视化全埋点截图功能目前仅支持 Chrome 浏览器，需要提前安装可视化全埋点截图插件。若无法访问前面的 Chrome 网上应用店地址，可以下载离线安装包，然后通过开发者模式 → 加载已解压的扩展程序进行安装。

5. App 内嵌 H5

对于 App 内嵌的 H5 页面，如果开启了全埋点功能，并进行App 打通 H5 后。在进行 App 可视化全埋点配置时，分析平台可以自动识别出 H5 页面，并支持对 H5 控件的可视化选择。

版本要求

  • 神策分析 v1.17.3232 及以上版本或 v2.0.3236 及以上版本
  • Android SDK v4.0.7 及以上版本
  • iOS SDK v2.0.8 及以上版本
  • Web JS SDK v1.15.10 及以上版本


注意

对于 iOS App，目前仅支持使用 WKWebView 加载的 H5 页面。