tuto – rails – how to use ahoy_matey for heatmap

j’ai actuellement besoin de me dégager du temps pour lancer ma marketplace de vidéos mobile, et vu le boulot à l’horizon, il me faut une solution rapide à implémenter ..

donc je me lance de l’affiliation amazon avec comme source de traffic les pubs facebook !

j’ai poser un tracker de click sur le CTA d’affil amazon mais … malgré les visites, aucun click sur mon lien d’affil, du coup je suis bien obligé de tracker à une maille encore plus fine, càd combien de temps l’utilisateur reste sur la page avant de la quitter, est-ce qu’il scroll, ou encore est-ce qu’il y a des points chaud sur ma LP mobile (heatmap)

j’ai un peu fouillé pour trouver un truc tout fait pour les heatmap sur une appli rails et je n’ai rien trouvé de super engagant .. du coup une idée m’a traversé l’esprit : et si j’utilisais les events de mon tracker rails (ahoy_matey) pour enregistrer les données de heatmap ? 🙂

<script>
    function sendTracker(coords) {
      props=coords;
      $.ajax({
        url: "/ahoy/events",
        dataType: "json",
        type: "post",
        async:false,
        data: {
              name: "heatmap",
              properties: props
              },
        success:function(){
        }
      });
    }
    window.addEventListener('touchstart', function(e){
      var coords = e.targetTouches[0].pageX + "-" + e.targetTouches[0].pageY;
      sendTracker(coords);
    }, false);
</script>

le script ci-dessus enregiste les touches mobiles sur ma LP et envoi un post ajax à ahoy

 

 map = Heatmap.new
 ls_evt = Ahoy::Event.where( :name => "heatmap")
 ls_evt.each do |evt|
   spl = evt.properties.to_s.split("-")
   map << Heatmap::Area.new(spl[0].to_f, spl[1].to_f)
 end
 filename = "test.png"
 map.output(filename)

le petit bout de code ci-dessus récupère les events de type « heatmap » envoyés précédement et va générer une belle image (voir petit exemple ci-après).

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

voilà voilà

envoy 🙂