Giter VIP home page Giter VIP logo

pingback_heatmap's Introduction

*pingback_heatmap
     
**名词解释
     
pingback是sogou-ufo团队开发的一个可以获取用户在页面点击[mousedown event]坐标的Javascript工具,坐标原点是页面竖直平分线y=0[点击数据获取逻辑无需依赖pingback,任何统计逻辑,只要活着到的数据满足pos=x_y&pageUrl=xxx即可]
     
pingback_heatmap基于pingback,heatmap,nodejs,phantomjs和php的再服务器端提前生成热力图的工具,查看效果的时候,只需要打开引用pingback js的页面,引入pingback_heatmap的api javascript,就可以查看不同日期的热力图,页面总点击数,并且可以通过鼠标创建选区获取某个特定区域的点击数

**原理
     
pingback将获取到的用户点击信息以日志形式发送到服务器[pingback_heatmap不包含存储及切日志的逻辑,提供给工具的原始数据须是处理好的文本文件,每行内容,如:pos=x_y pageUrl=http://123.sogou.com]
         
工具php部分会逐行读取log/目录下所有文本文件,提取出x_y值,并以pageUrl为维度分成不同的Javascript可方便读取的文件,并转存到initlog/目录下 
            
工具nodejs部分会逐文件读取initlog/目录内容,以1024为viewport将x_y坐标转换成以(0,0)为原点的坐标,并统计求和,并以x值做排,处理完成后,会根据日期生成对应的json文件转存到data/目录下
                
工具phantomjs部分根据处理好的json文件生成对应的png32背景透明图片转存到img/目录下

工具需要配置cronrab 定时任务,每天执行一次日志下载,日志初始化,图片生成,数据发送,一般日志都是次日生成昨天的逻辑,因此建议如下格式添加定时任务[假设每天早上6点日志已经被处理成文本]
    * 7 * * * sh pingback_heatmapDir/data.get.sh
    * 8 * * * sh pingback_heatmapDir/data.init.sh
    * 9 * * * sh pingback_heatmapDir/data.process.sh
    * 11 * * * sh pingback_heatmapDir/data.get.sh
工具在处理海量数据的时候可能会出现问题【测试20M体积日志,整个流程耗时在数分钟】,工具会输出一些简单的日志到run.log以及错误日志到err.log
                    
以上,服务器端预处理完成
    
查看效果的时候,只需要打开引用pingback js的页面,以书签或者其他方式引入pingback_heatmap js api后就可以直接选择日期查看效果,访问安装目录下的bookmark.html将工具添加为书签
                        
**安装

工具依赖php,nodejs,phantomjs以及web服务,下载包到可访问的web目录下,配置conf.php,然后执行php install.php完成安装
     
安装完成后根据需要配置crontab定时任务

pingback_heatmap's People

Contributors

gogoyqj avatar sogou-ufo avatar

Watchers

James Cloos avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.