Keen Tracking.js 使用教程

Keen Tracking.js 使用教程

keen-tracking.jsA light, fast and flexible javascript tracking library项目地址:https://gitcode.com/gh_mirrors/ke/keen-tracking.js

1、项目介绍

Keen Tracking.js 是一个轻量级、快速且灵活的 JavaScript 跟踪库，专门用于收集和分析用户行为数据。它可以帮助开发者轻松地捕获页面浏览、点击、表单提交等事件，并通过 Keen IO 平台进行数据分析和可视化。

2、项目快速启动

安装

首先，通过 npm 安装 Keen Tracking.js：

npm install keen-tracking --save

或者，你可以使用 CDN 引入：

<script crossorigin src="https://cdn.jsdelivr.net/npm/keen-tracking@5/dist/keen-tracking.min.js"></script>

初始化

在项目中初始化 Keen Tracking.js，并配置你的 Project ID 和 Write Key：

import KeenTracking from 'keen-tracking';

const client = new KeenTracking({
  projectId: 'YOUR_PROJECT_ID',
  writeKey: 'YOUR_WRITE_KEY'
});

client.initAutoTracking();

记录事件

你可以通过 recordEvent 方法记录自定义事件：

client.recordEvent('pageviews', {
  title: document.title,
  url: window.location.href
});

3、应用案例和最佳实践

捕获页面浏览

通过 Keen Tracking.js，你可以轻松捕获用户的页面浏览事件：

client.recordEvent('pageviews', {
  title: document.title,
  url: window.location.href
});

捕获点击事件

你还可以捕获用户的点击事件，并记录相关数据：

document.addEventListener('click', function(event) {
  client.recordEvent('clicks', {
    target: event.target.tagName,
    x: event.clientX,
    y: event.clientY
  });
});

表单提交

通过 Keen Tracking.js，你可以捕获表单提交事件，并记录表单数据：

document.querySelector('form').addEventListener('submit', function(event) {
  event.preventDefault();
  const formData = new FormData(event.target);
  client.recordEvent('form_submissions', Object.fromEntries(formData));
});

4、典型生态项目

Keen Analysis.js

Keen Analysis.js 是一个 JavaScript 客户端库，用于在 Keen IO 平台上进行数据查询和分析。你可以通过它轻松地进行复杂的数据查询和分析。

Keen Dataviz.js

Keen Dataviz.js 是一个 JavaScript 数据可视化库，专门用于创建交互式图表。你可以通过它将 Keen IO 平台上的数据可视化，生成精美的图表。

Keen Explorer

Keen Explorer 是一个可视化工具，用于探索和分析 Keen IO 平台上的数据。你可以通过它轻松地进行数据探索和分析，生成报告和仪表盘。

通过这些生态项目，你可以构建一个完整的数据分析和可视化解决方案，帮助你更好地理解和利用用户行为数据。

keen-tracking.jsA light, fast and flexible javascript tracking library项目地址:https://gitcode.com/gh_mirrors/ke/keen-tracking.js