events (knowledge graph)
Description
Apply custom events triggered on Knowledge Graph widget during the life-cycle:
-
nav
- Fired when request to web service is done; Invoked with arguments:event
,box
,url
andtype
, wheretype
is a navigation action and can be:go
- navigate to Knowledge Graph entityrel
- click on category of entitytab
- select a relationshipprev
,next
- paginate to previous/next page in list viewpage
- paginate to specific page number in list viewexternal
- navigate to entity URLshare
- click on a share tool
-
render
- Fired when view is rendered; Invoked with arguments:event
,box
,url
anddata
, wheredata
is processed output from Knowledge Graph endpoint.
All events will receive the below parameters:
event
- JavaScriptEvent
objectbox
- configuration of Knowledge Graph widgeturl
- current Knowledge Graph API endpoint
Default value
events: null
Examples
Enable tracking
events
parameter can be used to enable third-party tracking of endpoint clicks in Knowledge Graph widget.
Basic setting of google analytics
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', '<googla-analytics-ID>', 'auto');
ga('send', 'pageview');
</script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(document).knowledgeGraph({
...
events: {
nav: function(event, box, url, type) {
ga('send', 'event', {eventCategory: type, eventAction: url});
}
}
});
});
</script>
Friendly display setting
events: {
nav: function(event, box, url, type) {
const t = {
go: 'View entity',
rel: 'View relationships',
tab: 'Filter relationships',
prev: 'Click on previous in pagination',
next: 'Click on next in pagination',
page: 'Click on page number in pagination',
external: 'Open entity',
share: 'Share entity'};
ga('send', 'event', { eventCategory: 'Funnelback Knowledge Graph', eventAction: t[type] || type, eventLabel: url });
}
}