JSP - DWR - Servlet - Tooltip

[mausbull]

Hi,

I'm using JFreeChart to create a chart for my Web Application. I've been successfully using it for quite some time but now I'm stuck with adding tooltip support.

I'm using the following process to create an image:

User clicks -> javascript calls a DWR function -> Server Code is executed, JFreeChart object is stored in the session -> DWR reply updates the IMG tag -> ChartViewer Servlet is called -> returns the image

The following code is used at the moment

ServerCode for DWR

Code: Select all

public void createDissociationRawChart(ArrayList wellIds, HttpSession sess)
  {

    Connection connection = null;

    try {
      log_.info("fetching dissociation, begin ...");
      XYSeriesCollection xyDS = new XYSeriesCollection();

      HashMap wellIdName = (HashMap) sess
          .getAttribute(GlobalConstants.RESULT_HASH_WELLS_ID_NAME);

      
      /**
       * JDBC Query
       */

          
      log_.debug("get Initial Context");
      Context ctx = new InitialContext();
      DataSource ds = (DataSource) ctx.lookup(UtilsConstants.DATASOURCE_JNDI);
      connection = ds.getConnection();

      log_.info("start prepared statement");
      PreparedStatement ps = connection
          .prepareStatement(GlobalConstants.DISSOCIATION_SQL);

      /**
       * go over each well id and add values to the dataset
       */
      for (Iterator idIter = wellIds.iterator(); idIter.hasNext();) {
        String stringId = (String) idIter.next();

        log_.info("stringId: " + stringId);
        
        ps.setInt(1, Integer.parseInt(stringId));
        ps.setString(2, GlobalConstants.DISSOCIATION_RAW_CHANNEL);
        ResultSet rs = ps.executeQuery();

        XYSeries xySeries = null;

        String wellName = (String) wellIdName.get(stringId);
        if (wellName == null || wellName.length() < 1) {
          xySeries = new XYSeries(stringId);
        } else {
          xySeries = new XYSeries(wellName);
        }

        boolean check = false;
        while (rs.next()) {
          check = true;
          xySeries.add(rs.getDouble(1), rs.getDouble(2));
        }

        // if resultset has no entries of this well -> don't show it in chart
        if (check) {
          log_.info("series has data objects");
          xyDS.addSeries(xySeries);
        } else {
          log_.info("series (" + stringId + "," + wellName + ") has no data associated -> skipping from chart");
        }

        rs.close();
      }
      ps.close();

      connection.close();
      ctx.close();

      JFreeChart myLineGraph = ChartFactory.createXYLineChart("Dissociation",
          "Temperature (C)", "Raw", xyDS, PlotOrientation.VERTICAL, true,
          true, false);
      // set background image
      myLineGraph.setBackgroundPaint(new Color(205, 205, 205));
      
      //    Adding the Tooltips           
      XYPlot plot = myLineGraph.getXYPlot();
      SpectrumTTGenerator gen = new SpectrumTTGenerator();
      XYLineAndShapeRenderer renderer = new XYLineAndShapeRenderer();
      renderer.setToolTipGenerator(gen);
      
      plot.setRenderer(renderer);

      sess.setAttribute(GlobalConstants.RESULT_CHART, myLineGraph);

      log_.info("fetched dissociation");

    }
    catch (NamingException e) {
      log_.error("NamingException during creation of Dissociation Raw Chart");
      e.printStackTrace();
    }
    catch (SQLException e) {
      log_.error("SQLException during creation of Dissociation Raw Chart");
      e.printStackTrace();
    }

  }

ChartViewer Servlet

Code: Select all

  public void doGet(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {

    // get ImageMap
    ChartRenderingInfo info = new ChartRenderingInfo(new  StandardEntityCollection()); 

    // get the chart from storage

    JFreeChart chart = (JFreeChart) request.getSession().getAttribute(
        WebConstants.RESULT_CHART);
    

    if (chart != null) {
      // manipulate cache
      response.setHeader("Pragma", "no-cache");
      response.setDateHeader("Expires", 0);
      response.setHeader("Cache-Control", "no-cache, post-check=0, pre-check=0");

      // set the content type so the browser can see this as it is
      response.setContentType("image/png");

      
      
      
      // send the picture
      BufferedImage buf = chart.createBufferedImage(800, 450, info);
      
      OutputStream out = response.getOutputStream();
      PrintWriter writer = new PrintWriter(out);
      
      ChartUtilities.writeImageMap(writer, "imageMap", info, false);
      ChartUtilities.writeBufferedImageAsPNG(out,buf);
      
      writer.flush();
      out.close(); 
      
      
      
      
    }

    // remove chart from session
    request.getSession().removeAttribute(WebConstants.RESULT_CHART);

  }

JSP Page

Code: Select all

<IMG src="ChartViewer" id="chartimage" alt="" valign="top" usemap="#imageMap">

Can anyone tell me, what I've to do, to enable tooltips on my webpage.

thanks a lot
Stephan

[david.gilbert]

You need to create an HTML image map to go with the PNG image. See the ImageMapUtilities class.

[mausbull]

ok thanks,

now the part in my ChartViewer Servlet which creates the image looks like this:

Code: Select all

      
      // send the picture
      BufferedImage buf = chart.createBufferedImage(800, 450, info);
      
      OutputStream out = response.getOutputStream();
      PrintWriter writer = new PrintWriter(out);
            
      ChartUtilities.writeBufferedImageAsPNG(out,buf);
      ImageMapUtilities.writeImageMap(writer, "imageMap", info);
      
      writer.close();
      out.close(); 

But still there are no <map> tags on my jsp. Do I need to call a method which returns this html code?

thanks
Stephan

[david.gilbert]

You can't write the PNG image bytes and the HTML image map fragment to the same output stream. You need two servlets, one returning the HTML including the image map, and another that just returns the PNG image. The latter servlet should get invoked by the HTML that is returned by the former.

[mausbull]

ok I see

Now I'm able to create that image map and even send it via DWR to my JSP page.

The only problem I'm having right now is to include this javascript text into my html part. My design does not allow me to reload this page and I need a fresh imageMap for each newly loaded image.

Does anyone know how this can be done (i.e. using the dom model)?
Is it possible to retrieve the image map using javascript?

thanks
stephan