start using html div graph for

PageStatsdb.cpp now too.
This commit is contained in:
mwells 2013-10-14 20:35:45 -07:00
parent 80918ca6e3
commit 8f93a72961
4 changed files with 215 additions and 95 deletions

@ -67,7 +67,8 @@ bool sendPageStatsdb ( TcpSocket *s, HttpRequest *r ) {
st->m_niceness = MAX_NICENESS;
st->m_socket = s;
st->m_request = *r;
//st->m_request = *r;
st->m_request.copy ( r );
// hostId must be one of the following:
// 0-n - a valid hostId
@ -120,7 +121,9 @@ bool sendPageStatsdb ( TcpSocket *s, HttpRequest *r ) {
st->m_endDate = st->m_endDateR;
}
//
// this is no longer a gif, but an html graph in g_statsdb.m_sb
//
if ( ! g_statsdb.makeGIF ( st->m_endDateR ,
st->m_startDateR ,
st->m_samples ,
@ -211,15 +214,27 @@ void sendReply ( void *state ) {
buf.safePrintf("<table cellpadding=10 border=0>\n");
buf.safePrintf("<tr><td>"
"<center>"
"<img src=\"/stats%li.gif\" height=%li width=%li "
"border=\"0px\">"
"</center>"
"<center>");
/////////////////////////
//
// insert the div graph here
//
/////////////////////////
buf.cat ( g_statsdb.m_gw );
// purge it
g_statsdb.m_gw.purge();
//"<img src=\"/stats%li.gif\" height=%li width=%li "
//"border=\"0px\">"
//st->m_hostId,
//g_statsdb.getImgHeight(),
//g_statsdb.getImgWidth());
buf.safePrintf("</center>"
//"class=\"statsdb_image\">"
"</td></tr>\n",
st->m_hostId,
g_statsdb.getImgHeight(),
g_statsdb.getImgWidth());
"</td></tr>\n");
// the map key
buf.safePrintf("<tr><td>");

@ -488,7 +488,7 @@ void Stats::addSpiderPoint ( long errCode, bool isNew ) {
}
}
// draw a HORIZONTAL line in html 5 i guess
// draw a HORIZONTAL line in html
void drawLine2 ( SafeBuf &sb ,
long x1 ,
long x2 ,

@ -101,6 +101,13 @@ static Label s_labels[] = {
//{ "parm_change",0xffc0c0} // pink?
};
void drawLine3 ( SafeBuf &sb ,
long x1 ,
long x2 ,
long fy1 ,
long color ,
long width ) ;
Label *Statsdb::getLabel ( long labelHash ) {
Label **label = (Label **)m_labelTable.getValue ( &labelHash );
if ( ! label ) return NULL;
@ -473,6 +480,9 @@ bool Statsdb::makeGIF ( long t1Arg ,
m_sb3.reset();
m_ht3.reset();
// print graph in here as a bunch of divs now:
m_gw.purge();
// . start at t1 and get stats lists, up to 1MB of stats at a time
// . subtract 60 seconds so we can have a better shot at having
// a moving average for the last SAMPLE points
@ -491,6 +501,7 @@ bool Statsdb::makeGIF ( long t1Arg ,
return true;
// open the file for the gif
/*
char fname [ 1024 ];
sprintf ( fname , "%s/stats%li.gif" ,
g_hostdb.m_httpRootDir , g_hostdb.m_hostId );
@ -500,6 +511,7 @@ bool Statsdb::makeGIF ( long t1Arg ,
fname , mstrerror(errno) );
return true;
}
*/
return gifLoop ();
}
@ -538,9 +550,9 @@ bool Statsdb::gifLoop ( ) {
// shortcut
Msg5 *m = &m_msg5;
#ifndef _USEPLOTTER_
return true;
#endif
//#ifndef _USEPLOTTER_
//return true;
//#endif
// loop over all the lists in the time range, [m_t1,m_t2]
for ( ; ! m_done ; ) {
@ -572,53 +584,87 @@ bool Statsdb::gifLoop ( ) {
}
// define time delta - commented out because it's currently not used.
//long dt = m_t2 - m_t1;
long dt = m_t2 - m_t1;
#ifdef _USEPLOTTER_
//#ifdef _USEPLOTTER_
// gif size
char tmp[64];
//char tmp[64];
// dimensions of the gif
sprintf ( tmp , "%lix%li", (long)DX+m_bx*2 , (long)DY+m_by*2 );
GIFPlotter::parampl ( "BITMAPSIZE" , (void *)tmp );
//sprintf ( tmp , "%lix%li", (long)DX+m_bx*2 , (long)DY+m_by*2 );
//GIFPlotter::parampl ( "BITMAPSIZE" , (void *)tmp );
// create one
GIFPlotter plotter ( NULL , m_fd , NULL );
//GIFPlotter plotter ( NULL , m_fd , NULL );
// open it
plotter.openpl ( );
//plotter.openpl ( );
// define the space with boundaries 100 unit wide boundaries
//plotter.space ( -m_bx , -m_by , DX + m_bx , DY + m_by );
plotter.space ( 0 , 0 , DX + m_bx * 2 , DY + m_by * 2 );
//plotter.space ( 0 , 0 , DX + m_bx * 2 , DY + m_by * 2 );
// line thickness in user coordinates (pixels for us)
plotter.linewidth ( 1 );
//plotter.linewidth ( 1 );
// set bg color to gray (r/g/b)
plotter.bgcolor ( 0xd600 , 0xce00 , 0xd600 );
// set bg color to white (r/g/b)
//plotter.bgcolor ( 0xff00 , 0xff00 , 0xff00 );
//plotter.bgcolor ( 0xd600 , 0xce00 , 0xd600 );
// erase Plotter's graphics display
plotter.erase ();
//plotter.erase ();
// draw axises in black
plotter.pencolorname ("black");
//plotter.pencolorname ("black");
//
// main graphing window
//
m_gw.safePrintf("<div style=\"position:relative;"
"background-color:#c0c0c0;"
//"overflow-y:hidden;"
"overflow-x:hidden;"
"z-index:-10;"
// the tick marks we print below are based on it
// being a window of the last 20 seconds... and using
// DX pixels
"min-width:%lipx;"
"min-height:%lipx;"
//"width:100%%;"
//"min-height:600px;"
"margin-top:10px;"
"margin-bottom:10px;"
"margin-right:10px;"
"margin-left:10px;\">"
,(long)DX
,(long)DY +20);
// draw the x-axis
plotter.line ( m_bx , m_by , DX + m_bx , m_by );
// draw the y-axis
plotter.line ( m_bx , m_by , m_bx , DY + m_by);
//plotter.line ( m_bx , m_by , DX + m_bx , m_by );
// 10 x-axis tick marks
for ( int x = DX/10 + m_bx ; x < DX - m_bx ; x += DX/10 ) {
for ( int x = DX/20 ; x <= DX ; x += DX/20 ) {
// tick mark
plotter.line ( x , m_by - 15 , x , m_by + 15 );
// generate label
long xv = (long)(dt * (long long)x / (long long)DX) -(long)dt;
char buf [ 32 ];
// in seconds, so put "s" in there
sprintf ( buf , "%lis" , xv );//(float)xv / 1000.0 );
// move cursor
plotter.move ( x , m_by - m_by / 2 - 9 );
// plot label
plotter.alabel ( 'c' , 'c' , buf );
//plotter.line ( x , -20 , x , 20 );
m_gw.safePrintf("<div style=\"position:absolute;"
"left:%li;"
"bottom:0;"
"background-color:#000000;"
"z-index:110;"
"min-height:20px;"
"min-width:3px;\"></div>\n"
, (long)x-1
);
long xv = (long)(dt * (long long)x/(long long)DX)-(long)dt;
// LABEL
m_gw.safePrintf("<div style=\"position:absolute;"
"left:%li;"
"bottom:20;"
//"background-color:#000000;"
"z-index:110;"
"min-height:20px;"
"min-width:3px;\">%lis</div>\n"
, (long)x-10
// the label:
, xv
);
}
HashTableX tmpht;
tmpht.set(4,0,0,NULL,0,false,m_niceness,"statsparms");
@ -647,7 +693,7 @@ bool Statsdb::gifLoop ( ) {
// . graph this single graph of this color
// . returns ptr to first point of different color!
plotGraph ( p , pend , gh , &plotter , zoff );
plotGraph ( p , pend , gh , m_gw , zoff );
// prevent collisions
zoff += 20;
@ -705,7 +751,7 @@ bool Statsdb::gifLoop ( ) {
}
// set the line width
plotter.linewidth ( pp->m_thickness );
//plotter.linewidth ( pp->m_thickness );
// get parm hash
long colorHash = pp->m_parmHash;
@ -716,9 +762,9 @@ bool Statsdb::gifLoop ( ) {
// . is really the parm hash in disguise
long c1 = colorHash & 0x00ffffff;
// use the color specified from addStat_r() for this line/pt
plotter.pencolor ( ((c1 >> 16) & 0xff) << 8 ,
((c1 >> 8) & 0xff) << 8 ,
((c1 >> 0) & 0xff) << 8 );
//plotter.pencolor ( ((c1 >> 16) & 0xff) << 8 ,
// ((c1 >> 8) & 0xff) << 8 ,
// ((c1 >> 0) & 0xff) << 8 );
long x1 = pp->m_a;
long x2 = pp->m_b;
@ -729,7 +775,8 @@ bool Statsdb::gifLoop ( ) {
// . DY does not include the axis and tick marks
long fy1 = DY - y1 + m_by ;
// plot it
plotter.line ( x1 , fy1 , x2 , fy1 );
//plotter.line ( x1 , fy1 , x2 , fy1 );
drawLine3 ( m_gw , x1 , x2 , fy1 , c1 , pp->m_thickness );
// add to map key? only if we haven't already
if ( tmpht.isInTable ( &colorHash ) ) continue;
@ -781,12 +828,15 @@ bool Statsdb::gifLoop ( ) {
//
// all done
if ( plotter.closepl () < 0 )
log("admin: Could not close performance graph object.");
//if ( plotter.closepl () < 0 )
// log("admin: Could not close performance graph object.");
// close the file
fclose ( m_fd );
//fclose ( m_fd );
#endif
//#endif
// close main graphing window
m_gw.safePrintf("</div>\n");
return true;
}
@ -795,15 +845,10 @@ bool Statsdb::gifLoop ( ) {
char *Statsdb::plotGraph ( char *pstart ,
char *pend ,
long graphHash ,
GIFPlotter *plotter ,
//GIFPlotter *plotter ,
SafeBuf &gw ,
long zoff ) {
#ifndef _USEPLOTTER_
return NULL;
#else
// . use "graphHash" to map to unit display
// . this is a disk read volume
Label *label = getLabel ( graphHash );
@ -853,20 +898,16 @@ char *Statsdb::plotGraph ( char *pstart ,
char *retp = p;
// set the line width
plotter->linewidth ( 1 );
//plotter->linewidth ( 1 );
long color = label->m_color;
// use the color specified from addStat_r() for this line/pt
plotter->pencolor ( ((color >> 16) & 0xff) << 8 ,
((color >> 8) & 0xff) << 8 ,
((color >> 0) & 0xff) << 8 );
//plotter->pencolor ( ((color >> 16) & 0xff) << 8 ,
// ((color >> 8) & 0xff) << 8 ,
// ((color >> 0) & 0xff) << 8 );
// how many points per pixel do we have now
//float res = (ymax - ymin) / (float)DY;
// . the minimum difference between ymax and ymin is minDiff.
// . this prevents us from zooming in too close!
float minDiff = (float)DY * label->m_minRes ;
@ -892,7 +933,7 @@ char *Statsdb::plotGraph ( char *pstart ,
// set the line width
plotter->linewidth ( 2 );
//plotter->linewidth ( 2 );
// reset for 2nd scan
p = pstart;
@ -945,7 +986,10 @@ char *Statsdb::plotGraph ( char *pstart ,
// skip if can't make a line
if ( firstPoint ) {
plotter->circle ( x2 , fy2 , 2 );
//plotter->circle ( x2 , fy2 , 2 );
long width = 4;
// draw a 4x4 box now:
drawLine3(m_gw,x2-width/2,x2+width/2,fy2,color,width);
firstPoint = false;
continue;
}
@ -959,32 +1003,38 @@ char *Statsdb::plotGraph ( char *pstart ,
// plot it
// BUT only iff not more than 5 seconds difference
float secondsPerPixel = (m_t2-m_t1)/(float)DX;
float dt = (x2 - x1) * secondsPerPixel;
//float secondsPerPixel = (m_t2-m_t1)/(float)DX;
// avoid this for now. mdw oct 14 2013.
//float dt = (x2 - x1) * secondsPerPixel;
//if ( dt <= 13 || x2 - x1 <= 10 )
// plotter->line ( x1 , fy1 , x2 , fy2 );
if ( dt <= 13 || x2 - x1 <= 10 )
plotter->line ( x1 , fy1 , x2 , fy2 );
// circle second point
plotter->circle ( x1 , fy1 , 2 );
plotter->circle ( x2 , fy2 , 2 );
//plotter->circle ( x1 , fy1 , 2 );
//plotter->circle ( x2 , fy2 , 2 );
// draw a 4x4 boxes now:
long width = 4;
drawLine3 ( m_gw,x1-width/2, x1+width/2, fy1,color, width);
drawLine3 ( m_gw,x2-width/2, x2+width/2, fy2,color, width);
}
plotter->linewidth ( 1 );
//plotter->linewidth ( 1 );
// plot unit lines
float deltaz = (ymax-ymin) / 6;
if ( strstr(label->m_keyDesc,"latency" ) ) {
// draw it
drawHR ( 400.0 - 111.0 , ymin , ymax , plotter , label , zoff,0xff0000);
drawHR ( 600.0 - 111.0 , ymin , ymax , plotter , label , zoff , color);
drawHR ( 400.0 - 111.0 , ymin,ymax,m_gw,label,zoff,0xff0000);
drawHR ( 600.0-111.0,ymin,ymax,m_gw,label,zoff,color);
}
if ( strstr(label->m_keyDesc,"queries per sec" ) ) {
// draw it
//deltaz /= 2;
//drawHR ( 120.0 , ymin , ymax , plotter , label , zoff , color );
//drawHR ( 130.0 , ymin , ymax , plotter , label , zoff , color );
drawHR ( 140.0 , ymin , ymax , plotter , label , zoff , color );
//drawHR(120.0, ymin , ymax , plotter , label , zoff , color );
//drawHR(130.0, ymin , ymax , plotter , label , zoff , color );
drawHR ( 140.0 , ymin , ymax ,m_gw , label , zoff , color );
}
@ -992,18 +1042,19 @@ char *Statsdb::plotGraph ( char *pstart ,
// breathe
QUICKPOLL ( m_niceness );
// draw it
drawHR ( z , ymin , ymax , plotter , label , zoff , color );
drawHR ( z , ymin , ymax , m_gw , label , zoff , color );
}
return retp;
#endif
//#endif
}
void Statsdb::drawHR ( float z ,
float ymin ,
float ymax ,
GIFPlotter *plotter ,
//GIFPlotter *plotter ,
SafeBuf &gw,
Label *label ,
float zoff ,
long color ) {
@ -1017,25 +1068,30 @@ void Statsdb::drawHR ( float z ,
// round off error
z2 += 0.5;
// for adjusatmnet
//float ptsPerPixel = (ymax-ymin)/ (float)DY;
float ptsPerPixel = (ymax-ymin)/ (float)DY;
// make an adjustment to the label then! -- Commented out because it's currently not used.
//float zadj = zoff * ptsPerPixel;
float zadj = zoff * ptsPerPixel;
#ifdef _USEPLOTTER_
//#ifdef _USEPLOTTER_
// use the color specified from addStat_r() for this line/pt
plotter->pencolor ( ((color >> 16) & 0xff) << 8 ,
((color >> 8) & 0xff) << 8 ,
((color >> 0) & 0xff) << 8 );
//plotter->pencolor ( ((color >> 16) & 0xff) << 8 ,
// ((color >> 8) & 0xff) << 8 ,
// ((color >> 0) & 0xff) << 8 );
// horizontal line
plotter->line ( m_bx, (long)z2 , DX + m_bx, (long)z2 );
//plotter->line ( m_bx, (long)z2 , DX + m_bx, (long)z2 );
long width = 1;
drawLine3 ( m_gw,m_bx, DX + m_bx, (long)z2,color, width);
// make label
char tmp[128];
// . use "graphHash" to map to unit display
// . this is a disk read volume
sprintf(tmp,label->m_format,z +zadj);//* label->m_yscalar);
/*
// a white shadow
plotter->pencolor ( 0xffff,0xffff,0xffff );
plotter->move ( m_bx + 80 + 2 , z2 + 10 - 2 );
@ -1056,7 +1112,21 @@ void Statsdb::drawHR ( float z ,
plotter->move ( m_bx + 80 , z2 + 10 );
// plot label
plotter->alabel ( 'c' , 'c' , tmp );
#endif
*/
// LABEL
gw.safePrintf("<div style=\"position:absolute;"
"left:%li;"
"bottom:20;"
//"background-color:#000000;"
"z-index:110;"
"min-height:20px;"
"min-width:3px;\">%s</div>\n"
, (long)m_bx+80
// the label:
, tmp
);
}
void gotListWrapper ( void *state , RdbList *list, Msg5 *msg5 ) {
@ -1435,3 +1505,33 @@ bool Statsdb::addEventPoint ( long t1 ,
log("stats: no room in graph for event");
return true;
}
//////////
//
// NEW CODE HERE
//
//////////
// draw a HORIZONTAL line in html
void drawLine3 ( SafeBuf &sb ,
long x1 ,
long x2 ,
long fy1 ,
long color ,
long width ) {
sb.safePrintf("<div style=\"position:absolute;"
"left:%li;"
"top:%li;"
"background-color:#%lx;"
"z-index:-5;"
"min-height:%lipx;"
"min-width:%lipx;\"></div>\n"
, x1
, (fy1 - width/2) - 20 //- 300
, color
, width
, x2 - x1
);
}

@ -73,13 +73,15 @@ class Statsdb {
char *plotGraph ( char *pstart ,
char *pend ,
long graphHash ,
class GIFPlotter *plotter ,
//class GIFPlotter *plotter ,
SafeBuf &gw,
long zoff );
void drawHR ( float z ,
float ymin ,
float ymax ,
class GIFPlotter *plotter ,
//class GIFPlotter *plotter ,
SafeBuf &gw,
class Label *label ,
float zoff ,
long color ) ;
@ -119,6 +121,9 @@ class Statsdb {
RdbList m_list;
Msg1 m_msg1;
// the graphing window. now a bunch of absolute divs in html
SafeBuf m_gw;
SafeBuf m_sb0;
SafeBuf m_sb1;