Issue with Arrow and Bar Formatters

[Prakriti-nith]

Out of these six formatters, Arrow and Bar are causing some issues and rest are working fine. Bar formatter is working correctly in rails but in IRuby notebook it generates weird bars. See examples. Arrow formatter is neither generating arrows in nbviewer (working fine in localhost) nor in rails.

[Shekharrajak]

iframe html tag can help to solve these kinds of issues. Refer : https://www.w3schools.com/tags/att_iframe_srcdoc.asp

We have to use our html code for the chart as the srcdoc in iframe tag.

[snpd25]

@Shekharrajak can you give an insight of how the appropriate code would have worked in the example

[Prakriti-nith]

@snpd25 Check these examples of Arrow formatter and bar formatter from Google Charts. Also run these rails examples to know how the bar formatter is working in rails.

[snpd25]

Thanks @Prakriti-nith , actually I am new to the code base, can you please tell me which file/code-snippet needs modification?
Thanks.

[Prakriti-nith]

Have a look at the to_html method which generates the HTML code for the chart.

[snpd25]

@Prakriti-nith , I have checked all the methods related to the formatters and they are all according to the googlecharts api documentation, but the html-script generated for the bar is this:
<span style="padding: 0; float: left; white-space: nowrap;"><img style="padding: 0" src="https://ajax.googleapis.com/ajax/static/modules/gviz/1.0/util/bar_s.png" height="12" width="1" /><img style="padding: 0" src="https://ajax.googleapis.com/ajax/static/modules/gviz/1.0/util/bar_b.png" height="12" width="9" /><img style="padding: 0" src="https://ajax.googleapis.com/ajax/static/modules/gviz/1.0/util/bar_w.png" height="12" width="1" /><img style="padding: 0" src="https://ajax.googleapis.com/ajax/static/modules/gviz/1.0/util/bar_s.png" height="12" width="1" /> 1,000</span>

[Shekharrajak]

I think there is conflict in jupyter notebook html (JS) and googleapi JS in the html of the notebook (when it serve in browser).