<div id='info'>
<h3><code>displayHtml();</code></h3>
<p>Customise info at the tip of the chart taking HTML tags or a String as argument. It can include a function of parameters <code>d</code> for data and <code>i</code> for the dataset. Tags can include images displaying in "gif" or "png" format.</p>
<p>Example below shows how If Statements can be used to trigger different hovering events for different tips.</p>
<p>The chart below triggers an html tag at data <code>d</code> equals <code>30</code>.</p>
<p><code>.displayHtml((d, i)=>{if(d == 30){ ..);</code></p>
</div>
//Redsift
//displayHtml();
//Customise tip of the bar chart
//return gif at data equal 30
let chart = d3_rs_bars.html()
.displayHtml((d, i)=>{
if(d == 30){ //data equal 30
return 'Data equal '+ d +'.<br><img width="100" src="http://www.thisiscolossal.com/wp-content/uploads/2013/01/3.gif"/>' //output gif image
}else{
return d; //return all the data
}
});
d3.select('body').datum([1,2,30,20]).call(chart);
View Compiled