PNG is always a white square

[Naraujo13]

type: bug

Environment:

• Chartify version(s): 2.6.0
• Operating System(s): Windows
• Python version(s): 3.7.1

What happened:

The PNG version of the charts always generate a white square image.
The HTML works normally.

What you expected to happen:
It was expected to generate the png of the graphic.

How to reproduce it (as minimally and precisely as possible):
Install the chrome driver and pipefy and try to generate any chart as png with jupyter

[Robmosh91]

+1 I have the same issue. Can anyone help solving it? Saving to html does work though.

[cjslcjr]

I have the same issue, still not able to figure it out.

[fanglinwang]

+1.

[ColCh]

Got this on my Ubuntu server 20.04

Wanted to do a bit debugging here.

screenshot of Chrome debugger connected to webdriver (added options.add_argument('--remote-debugging-port=9222'))

To enable webdriver logs, do this (edit source code for chartify):

driver = webdriver.Chrome(
    options=options,
    # add this
    service_args=[
        "--verbose",
        "--log-path=/home/ubuntu/melcharter/webdriver.log",
    ],
)

webdriver logs:

[1632007907.997][DEBUG]: DevTools WebSocket Command: Page.navigate (id=16) 3A8C277E36F2C399656DAAE2ADBEFBC5 {
   "url": "file:////tmp/chartifyp70vb2rl.html"
}
[1632007908.003][DEBUG]: DevTools WebSocket Response: Page.navigate (id=16) 3A8C277E36F2C399656DAAE2ADBEFBC5 {
   "errorText": "net::ERR_FILE_NOT_FOUND",
   "frameId": "3A8C277E36F2C399656DAAE2ADBEFBC5",
   "loaderId": "BB149E8D4D35D3D49671161BD4FA9881"
}

So, chromium says that there is no such file, but simple stat /tmp/chartifyp70vb2rl.html shows that there is it.

If I change chart path right within chartify sourcecode from /tmp to /home, it works.

This code was patched

chartify/chartify/_core/chart.py

Lines 433 to 471 in 5ac3a88

	def _initialize_webdriver(self):
	"""Initialize headless chrome browser"""
	options = Options()
	options.add_argument("window-size={width},{height}".format(
	width=self.style.plot_width, height=self.style.plot_height))
	options.add_argument("start-maximized")
	options.add_argument("disable-infobars")
	options.add_argument("disable-gpu")
	options.add_argument('no-sandbox') # Required for use in docker.
	options.add_argument("--disable-extensions")
	options.add_argument('--headless')
	options.add_argument('--hide-scrollbars')
	driver = webdriver.Chrome(options=options)
	return driver
	def _figure_to_png(self):
	"""Convert figure object to PNG
	Bokeh can only save figure objects as html.
	To convert to PNG the HTML file is opened in a headless browser.
	"""
	driver = self._initialize_webdriver()
	# Save figure as HTML
	html = file_html(self.figure, resources=INLINE, title="")
	fp = tempfile.NamedTemporaryFile(
	'w', prefix='chartify', suffix='.html', encoding='utf-8')
	fp.write(html)
	fp.flush()
	# Open html file in the browser.
	driver.get("file:///" + fp.name)
	driver.execute_script("document.body.style.margin = '0px';")
	png = driver.get_screenshot_as_png()
	driver.quit()
	fp.close()
	# Resize image if necessary.
	image = Image.open(BytesIO(png))
	target_dimensions = (self.style.plot_width, self.style.plot_height)
	if image.size != target_dimensions:
	image = image.resize(target_dimensions, resample=Image.LANCZOS)
	return image

Screenshot with code

The reason is snap.

Refs:

• https://askubuntu.com/questions/1263843/how-to-allow-snap-applications-to-access-tmp-folder
• https://askubuntu.com/questions/1184357/why-cant-chromium-suddenly-access-any-partition-except-for-home/1284975#1284975
• https://bugs.launchpad.net/ubuntu/+source/chromium-browser/+bug/1851250
• https://forum.snapcraft.io/t/sharing-files-via-tmp/1613/21
• https://askubuntu.com/questions/1215305/how-can-i-grant-a-snap-application-access-to-tmp-via-command-line

So I just fixed my issue with plots by uninstaling chromium snap version and installing unsnapped version:

• sudo snap remove --purge chromium
• Go to https://askubuntu.com/questions/1204571/how-to-install-chromium-without-snap