|
Odd behavior of multiple realtime charts |
Posted by Jim Azeltine on Feb-16-2017 04:04 |
|
I was able to build a nice real-time dashboard with four different line charts. Everything is working well with the dashboard, but I hit a snag. I was asked to provide the capability provide an image map and be able to drill down on a particular minute on one of the 60 minute charts. I have it working, but something really odd is happening.
I have it set up to use the partial update method on the individual charts, and have used the <iframe> tag to lay out the screen in a table. The odd thing is that the wrong charts are appearing in the frames. An example is the window is divided into to rows with two columns, and when the program starts the chart that is supposed to be displayed in the upper left is also displayed in the upper right is also displayed in the upper left and lower left. After some update cycles, different charts are displayed, very confusing. I attached a couple of captures of the first iteration and after the first update.
I think I need a method other that using <frameset> (same problem) or <iframe) to partition the window that can support the partial update process. The JSPs get access to a database object in the session to provide the data.
This is the controlling JSP, called from a servlet that does the session setup:
<%@ page
language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<jsp:useBean id="urlPrefixBean" scope="session"
class="com.jra.util.dashboard.beans.UrlPrefixBean"/>
<html>
<head>
<title>Asset Suite Dashboard </title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta name="date" content="2007-06-01" />
</head>
<table cellSpacing="0" cellPadding="0" border="1">
<tr vAlign="center">
<td width="80%" bgColor="#000088">
<div style="padding-bottom:2px; padding-right:3px; font-weight:bold; font-size:10pt;
font-style:italic; font-family:Arial;">
<a style="color:#FFFF00; text-decoration:none"/></a>
</div>
</td>
<td align="left">
<img src="<%= urlPrefixBean.getUrlPrefix()%>/images/logo_small.jpg" width=75 height=35 align="right"/>
</td>
</tr>
<tr vAlign="top" >
<td colspan=2>
<div style="font-weight:bold; font-size:20pt; margin:5px 0px 0px 5px; font-family:Arial">
Realtime System Health Metrics
</div>
</td>
</tr>
</table>
<table cellSpacing="0" cellPadding="0">
<tr vAlign="top">
<td>
<iframe src="<%= urlPrefixBean.getUrlPrefix()%>/jsp/cpu_utilization.jsp" width="730" height="290" scrolling="no"></iframe>
</td>
<td>
<iframe src="<%= urlPrefixBean.getUrlPrefix()%>/jsp/tpm_usercount.jsp" width="750" height="290" scrolling="no"></iframe>
</td>
</tr>
</table>
<table cellSpacing="0" cellPadding="0">
<tr vAlign="top">
<td>
<iframe src="<%= urlPrefixBean.getUrlPrefix()%>/jsp/jvm_utilization.jsp" width="730" height="290" scrolling="no"></iframe>
</td>
<td>
<iframe src="<%= urlPrefixBean.getUrlPrefix()%>/jsp/tpm_by_region.jsp" width="750" height="290" scrolling="no"></iframe>
</td>
</tr>
</table>
</html>
|
Re: Odd behavior of multiple realtime charts |
Posted by Peter Kwan on Feb-17-2017 01:43 |
|
Hi Jim,
As I do not have your actual charting code, I would just guess. I guess it may be because all your charts are using same session variable name, such as "chart1":
String chart1URL = c.makeSession(request, "chart1");
If you have multiple charts on the same web page, and makeSession is used, the charts should have different session variable names. You may use "chart1", "chart2", ...etc., or use the same that fit your chart type such as "jvm_utilization", "tpm_usercount", etc..
If it because when makeSession is used, the code just creates the chart and stores it in a session variable. It does not deliver the chart to the browser. It just delivers the <IMG> tag which contains a URL for the browser to load the chart. By the time the browser gets the <IMG> tag and tries to load the chart, your code may have already created all 4 charts, and stored them in the same session variable "chart1". So the latest chart will overwrite all earlier charts, and all four <IMG> tags will show the same chart.
Using different session variables for the 4 charts should solve this issue.
Regards
Peter Kwan |
Re: Odd behavior of multiple realtime charts |
Posted by Jim Azeltine on Feb-17-2017 02:04 |
|
Thanks, you got it right. I am guilty of "cloning"! I altered the variable names to make them unique and solved that problem. |
|