pChart - Display png image on browser

Question

I am using the pChart class library to display .png Image on the browser. Through AJAX, I call the controller action graphgenerator to call generateGraph function in a model and display the output through a view on the browser.

The generateGraph function in the MVC model, tries to generate graphs in a loop with an HTML table using pChart's stroke() function.

When I view the output in the browser, that comes with the controller, I see it as under:

How can I make sure I display the images instead of the following binary data?

�PNG  ��� IHDR����������h����tRNS������7X}�� �IDATx���wt[Y~'���C
H�Q�(�RV)TUW��v�}��cό�9�;g�xvv�;s��z����a�㝙 �v�cUu�����L�,Q)f��/��@E�� ���� 

����.���{��W?"������P}�rW�������� !�����@�BB�����P�������T)$�������U !�����@�BB �����P�X˲�]����� �(!������RH������B��������������J!!������RH������ B��������������Jaaz������*�+�������U !�����@�BB�����P�������T)$�������U !�����@�BB �����P��!�����@�b˸������m����s��EA��0LE��^늧�2�

Answer 1

Save it to disk, and return the url to the browser. Then create an tag with that url.

Answer 2

Generate that binary data dynamically as the result of a URL: i.e. accessing mysite.com/script/generateGraph/1/2/4/5

Place that link as the src attribute of an image tag, and you should be good to go.