How can I include a JFreeChart servlet image in a JSP - java

I have seen several examples of using a Servlet to dynamically generate a chart using JFreeChart, and subsequently including that image in a JSP using an img tag. For example:
<img src="/MyChartServlet" width="400" height="300" border="0" alt="" />
My servlet which generates the image using JFreeChart works great, and I can see the image if I call it directly in the browser as in:
http:/myurl/MyChartServlet?id=274
The problem is that my JSP does not display the image. In fact, the JSP is not even invoking the servlet. I know this because I do not see the debug entries in the log that appear when the servlet is called.
In the Servlet I am using the JFreeChart ChartUtilities.writeChartAsJPEG() method to write the image to the output stream of the response, because I do not want to write the image to disk. As mentioned the servlet works fine when called directly.
What am I missing? Or is there a better way to do this? Maybe a plain old object can generate the chart and I can include that in the JSP? Any help would be appreciated.

You're going about it the right way. You may be having some kind of relative path issue from the context you're in. Try
<img src="http://<full path to your servlet>" ...
Also, you have a ?id=274 in your example, but not in your img src. If that's required, put that in there as well.
If you posted your servlet code, that could help, but also make sure you have your content type set properly in your servlet
response.setContentType("image/jpeg");

Related

Output HTML and images from a servlet

There are many examples on the Net of outputting images from servlets by writing to request's output buffer.
Is it possible to create an entire HTML page with multiple images in a table from a servlet?
The images would be created on the fly by a bean.
You don't want to do it that way.
I would create two servlets:
To serve an HTML page with <img src="..."> elements for each image.
To serve the binary data of the image
Basically the first servlet would send the HTML to the client browser. The browser sends new HTTP requests for each <img> element it finds. The second servlet would handle those requests by writing the image's binary data directly to the response's OutputStream.
For small images, you can embed the images using css or directly in html.
To embed using css take a look at this.
This is what I would suggest:
<html>
<body>
<img alt="some title" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA.."/>
<img alt="some title" src="data:image/png;base64<data2>"/>
<img alt="some title" src="data:image/png;base64<data2>"/>
</body>
</html
To get the exact value you should have after base64 in src attribute, you should take a look at converting png images to base64.
This solution is somewhat non-ideal and might take the page to load forever if there are more than 10-15 images in the page.
If that is the case, then you should go with the other solution of linking to the url for servlets which serve image.

display an image from server with an output stream

I am trying to show an image from the server in my browser.I am following this link
http://balusc.blogspot.in/2007/04/imageservlet.html. i must say this is pretty well written and documented. I tried this and everything is working fine.
The problem is there when i am using ajax to display this image.the whole image seems to break into some codes inside the div.
i understand that the outputstream used in the code is writing directly to the page.But is it really not possible to handle that outputstream to somehow display the image in image tag of a jsp without having to create a different servlet.
Thank you for reading
You don't need to request image data via AJAX and then manipulate it yourself, in order to display it. Just use an <img> tag!
If /my_url is the location of your image, then
<img src="/my-url" alt="Appropriate description"/>
would do it. NOTE: /my-url doesn't have to be an actual image. It can be any resource (including a servlet) that returns image data with the appropriate MIME type set.
If you want to create the tag dynamically, you can use your favourite library, or do it iwth native JS:
var oImg=document.createElement("img");
oImg.setAttribute('src', '/my-url');
oImg.setAttribute('alt', 'Appropriate description');
oImg.setAttribute('height', imgHeight);
oImg.setAttribute('width', imgWidth);
document.body.appendChild(oImg);
Edit
If you want to be doing this server-side (and if so, is this really AJAX?), then you might want to look at the data uri scheme.
With this scheme, you can data directly to an image tag, without needing to provide it with an HTTP resource. To use this, you convert your outputstream to base64 and use the following:
<img src="data:image/png;base64,converted-data-stream-goes-here..." alt="Who needs HTTP?"/>
The image/png would change depending on the MIME type of your source data.
Read the linked Wikipedia page to fully understand the trade-offs here.
Just adding how i achieved a solution for it.
I referred to a new page(from the page i am submitting the form) through ajax and in the new page i used an image and through its src attribute i called the servlet method which is writing the image through its outputstream.
This way the servlet is writing my image to the new file which i can position anywhere.

How to JSP display multiple page with one layout (Example index.jsp?page=about display about.jsp)

I new in JSP, i have a problem with JSP
in php i use
$page=$_GET["page"]
for display multiple page for one layout it mean i have index , it display layout and when i click on menu go to about us the index url = index.jsp?page=about
in PHP when i declare $page above and next step i do
Switch($page){
case 1:about
include 'aboutus.php'
case 2:news
include 'news.php'
}
How can i do it ?
How jsp can do the same way php to display multiple page in 1 layout
Use jsp:include.
<jsp:include page="/WEB-INF/${param.page}.jsp" />
And pass ?page=news or ?page=about, etc as parameter. The ${param.page} prints the outcome of request.getParameter("page"). You can prevent direct access to JSP files (by entering URL in browser address bar) by placing JSP files in /WEB-INF folder.
See also:
Basic JSP/Servlet tutorials
Hidden features of JSP/Servlet
How to avoid Java code in JSP
nowadays you use "templates" of Java Server Faces (JSF) for this approach. When you use JSP, you actually don't use the same concept as in PHP. You'd better use the MVC concept. But to answer your question, you could probably achieve this with the include tag http://java.sun.com/products/jsp/tags/11/syntaxref1112.html and control it with JSTL:
http://www.java2s.com/Code/Java/JSTL/JSTLiftag.htm

How to implement custom JSF component for drawing chart?

I want to create a component which can be used like:
<mc:chart data="#{bean.data}" width="200" height="300" />
where #{bean.data} returns a collection of some objects or chart model object or something else what can be represented as a chart (to put it simple, let's assume it returns a collection of integers).
I want this component to generate html like this:
<img src="someimg123.png" width="200" height="300"/>
The problem is that I have some method which can receive data and return image, like:
public RenderedImage getChartImage (Collection<Integer> data) { ... }
and I also have a component for drawing dynamic image:
<o:dynamicImage width="200" height="300" data="#{bean.readyChartImage}/>
This component generates html just as I need but it's parameter is array of bytes or RenderedImage i.e. it needs method in bean like this:
public RenderedImage getReadyChartImage () { ... }
So, one approach is to use propertyChangedListener on submit to set data (Collection<Integer>) for drawing chart and then use <o:dynamicImage /> component. But I'd like to create my own component which receives data and draws chart.
I'm using facelets but it's not so important indeed. Any ideas how to create the desired component?
P.S. One solution I was thinking about is not to use <o:dynamicImage/> and use some servlet to stream image. But I don't know how to implement that correctly and how to tie jsf component with servlet and how to save already built chart images (generating new same image for each request can cause performance problems imho) and so on..
P.S. One solution I was thinking about is not to use and use some servlet to stream image. But I don't know how to implement that correctly and how to tie jsf component with servlet and how to save already built chart images (generating new same image for each request can cause performance problems imho) and so on..
Just give it an URL as attribute so that it ends up as <img src="url"> and let that URL point to the servlet. Let the servlet generate/return the image based on the information provided by request parameters or pathinfo in the URL.
As to the caching, just store it somewhere in the disk file system or a DB by some unique identifier and let the servlet on every request check if it is there and handle accordingly.
For this all the standard <h:graphicImage> would be already sufficient. Just make the URL dynamic.

Write Multiple Full HTML 'Files' to Single Output Stream?

I'm writing a testing utility- I want to show multiple finished HTML "pages" in a single browser window.
Is this possible? I'm using Java Servlets.
For example, normally the user goes to a utility screen, fills in a bunch of fields and POSTS this to my servlet, which builds up a full HTML stream based on their input and writes it to HttpServletResponse.getWriter(). When the user views source, they get a <html> ... </html>.
What I want to do is allow users to request multiple "screens" and get the results in a single web page where you'd scroll down to see the 2nd, 3rd, etc. screens, maybe there is some kind of divider in between. I thought of frames or iframes, but didn't have luck. I have seen where I can write my big html stream to a javascript variable, then use document.write to dump it into the iframe. But that seems pretty awkward, and I'd have to be really careful about escaping quotes and stuff.
You will have to use iframes or frames to do this. A single web page can only contain one set of html tags and thus one html page.
Another idea would be to render the page by your script and then capture a picture of it and then have a page containing images. You will of course loose all interaction with the page.
I'm not sure what you're trying with your frames, but I imagine frames should work OK for what you've described.
Instead of trying to post to more than one URL from your form, you just post to a servlet that returns a page with the frameset, and each frame has a source that points to one of the URLs you want to test. For example:
<form action="testServlet" method="post">
<input type="text" name="someValue" />
</form>
The testServlet then returns a page with this content:
<frameset rows="33%,33%,33%">
<frame src="testUrl1?someValue=value">
<frame src="testUrl2?someValue=value">
<frame src="testUrl3?someValue=value">
</frameset>
The only problem with this is that you're doing a GET instead of a POST, but that's easy to get around. All you would need do is to implement the doGet method within your servlets and just call doPost from within doGet.
Just leave out the <html>/</html> tags for each page and wrap the whole thing inside a single large ....
Like this maybe:
<html>
[page1Content]
<hr />
[page2Content]
<hr />
[page3Content]
<hr />
</html>

Categories

Resources