[ Team LiB ] Previous Section Next Section

Recipe 17.7 Embedding an SVG File in a JSP

Problem

You want to display a Scalable Vector Graphics (SVG) image inside a JSP.

Solution

Use the embed HTML element to position the SVG in the JSP.

Discussion

Developers typically use the embed tag to place an SVG file in an HTML file or JSP. SVG is an XML-based graphics technology that provides developers and designers leverage in producing and displaying interactive graphics.

Browsers use special SVG viewer applications to handle the embedded SVG files. Adobe System's SVG Viewer application can be downloaded from http://www.adobe.com/svg/viewer/install/. Corel's SVG Viewer can be downloaded from http://www.corel.com/svgviewer/.


Example 17-10 embeds an SVG file named testLogo.svg and points the user to the Adobe SVG Viewer download site if they have not installed an SVG Viewer application.

SVG files have extensions of either .svg or (in compressed form) .svgz, even though they are XML files.


Example 17-10. An SVG graphics file embedded in a JSP
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
<jsp:useBean id="date" class="java.util.Date" />

<html>
<head><title>SVG in a JSP</title></head>
<body>
<h2>A Scalable Vector Graphics example</h2>

<embed src=
    '<c:out value="${param.svg_source}"/>.svg' width=
    "200" height="200" type="image/svg-xml" pluginspage=
    "http://www.adobe.com/svg/viewer/install/"
>

<br /><c:out value="${date}"/>

</body>
</html>

Example 17-10 shows how to place an SVG within other JSP code elements, such as the taglib directive and the jsp:useBean standard action. Example 17-10 also dynamically loads an SVG based on the request parameter named svg_source. The code uses the JSTL c:out tag and the EL's param implicit object to output the parameter value (see Chapter 23 on the JSTL).

Figure 17-5 shows the result of requesting the JSP in Example 17-10, including the name of the SVG file as a request parameter. The request URL looks like:

http://localhost:8080/home/svg.jsp?svg_source=testLogo
Figure 17-5. A JSP page shows an SVG graphics file
figs/jsjc_1705.gif

The SVG shown in Figure 17-5 is derived from Adobe Systems Inc., which creates the Adobe SVG Viewer and an SVG-enabled graphics application, Adobe Illustrator.

See Also

SVG specifications at the W3 Consortium: http://www.w3.org/Graphics/SVG/Overview.htm8; Adobe's SVG Viewer install page: http://www.adobe.com/svg/viewer/install/; Recipes 17-3-5 on embedding a Flash file in servlets and JSPs; Recipe 17.6 on embedding a QuickTime movie in a JSP.

    [ Team LiB ] Previous Section Next Section