on Feb 13, 2015Have you ever created a custom pbd only to realize that the tables and graphs that are shown for metrics like Frontends, Backends, GC Monitor, ... don't work for your custom metrics? You can only view each single metric?
A quick solution
Well, here's a quick solution for you: use the Search tab!
Figure 1: Search tab
The search tab searches the whole subtree you have selected in the metric for occurrences of the string or regular expression you entered. Be careful: this can result in a lot of metrics being returned! Always select another tab when you are swiching context by selecting another node in the metrics tree.
Typeview Overview
A typeview is a construct used by both the APM Webview as well as the Introscope Workstation to present a desired view of metrics. It is typically a Window Tab and is usually associated with metrics associated with a selected node in the Workstation Investigator tree.
There are two methods for constructing a typeviewer. The first is via XML. The details of the typeviewer are placed into an XML file which is parsed by the Enterprise Manager. The second method is to develop a set of Java classes that are deployed to the Workstation as an extension. We will solely focus on XML typeviews in this article.
Although a variety of view types is available the two most widely used are the graphical and table views as depicted in the following screen shots.
Figure 2: Graph Typeview
Figure 3: Table Typeview
Note that it is possible to display both tables and graphs on the same typeview and the best example of using a mixture is the Search typeviewer (see Figure 1). In the Search Typeviewer, the search results are displayed as a table and if a row or rows are selected then a graph is also displayed of the selected rows.
The best way to think of a Typeviewer is that it is a Java Swing Window and therefore anything that can be placed on a Swing type Windows can probably be placed on a Typeviewer.
XML Typeviewers
The XML Typeviewer is easy to construct and work with but it does have limitations. To create an XML Typeviewer, you start by creating an XML file. This XML must conform to an XML Schema. The schema is reproduced here. The schema contains information about how to setup the typeviewer panel and includes layout, orientation and so forth. It also contains information about how to display the data selected.
Creating an XML Typeview
A “hello world” typeview could look like this:
<?xml version="1.0" encoding="UTF-8"?>
<TypeViewerSet xmlns="wily.typeviews" xmlns:its="http://www.w3.org/2005/11/its" namespace="wily.standard" version="2.0">
<TypeViewer id="hello-world" supported-items-specifier=".*" tab-order="1">
<Title its:translate="yes">Hello World</Title>
<Panel layout="BorderLayout">
<Label constraint="Center">
<Text its:translate="yes">Hello new World!</Text>
</Label>
</Panel>
</TypeViewer>
</TypeViewerSet>
Tip #1
Verify that the typeview xml complies with the wily.typeviews schema. Nearly every advanced text editor like Notepad++ or TextPad supports XML syntax highlighting and at least has a plugin for schema validation.
Tip #2
Use the supported-items-specifier attribute in the TypeViewerSet tag to select the nodes under which the xml typeview is going to appear. For example: with supported-items-specifier=”Servlets” a xml typeview is going to appear only under the node Servlet in the investigator tree.
Deploying an XML Typeview
- Copy the typeview xml file in the directory <EM_HOME>/ext/xmltv
- Restart the Webview server or logout and login from the workstation.
A more complex example
Now let's create a more complex example. Let's take a look at the "Tomcat" metrics (if you run a Tomcat server):
So we have the Tomcat node and below HTTP Sessions and ThreadPool (let's ignore Authentication). For every thread pool there are metrics for total thread count and busy threads.
Defining the typeviewers
So we define four Typeviewers, each of them referencing a component definition:
<TypeViewer id="Tomcat-Server" supported-items-specifier="Tomcat" tab-order="10">
<Title its:translate="yes">Tomcat</Title>
<Component id="tomcat.overview"/>
</TypeViewer>
<TypeViewer id="Tomcat-Sessions" supported-items-specifier="Tomcat\|HTTP Sessions" tab-order="10">
<Title its:translate="yes">Sessions</Title>
<Component id="tomcat.httpsessions"/>
</TypeViewer>
<TypeViewer id="Tomcat-ThreadPools" supported-items-specifier="Tomcat\|ThreadPool" tab-order="10">
<Title its:translate="yes">ThreadPools</Title>
<Component id="tomcat.threadpools" specifier-prepend="\|[^\|]*"/>
</TypeViewer>
<TypeViewer id="Tomcat-ThreadPool" supported-items-specifier="Tomcat\|ThreadPool\|[^\|]*" tab-order="10">
<Title its:translate="yes">ThreadPool</Title>
<Component id="tomcat.threadpool"/>
</TypeViewer>
The attribute supported-items-specifier denotes for which node in the metric tree the TypeViewer will be displayed. We are using regular expressions here like in a Management Module.
Defining the components
For the Tomcat Overview we want to display the server info on top, a graph for the sessions below and a table for the thread pools at the bottom. This is how we do that:
<ComponentDefinition id="tomcat.overview">
<SplitPane orientation="Vertical" split-ratio="0.1">
<LiveMetricValueLabel relative-metric=":Server Information">
<Title>Server Info: </Title>
</LiveMetricValueLabel>
<Panel columns="1" layout="GridLayout" rows="2">
<Graph relative-specifier="(.*):(.*) Sessions">
<Title its:translate="yes">Sessions</Title>
</Graph>
<MetricDataTable show-bottom-graph="false">
<Title>Thread Pools</Title>
<Column content-type="LastPrefixSegment" relative-width="3" segment-offset="0">
<Title its:translate="yes">Pool</Title>
</Column>
<Column content-type="NumericalValue" relative-specifier="(.*):getCurrentThreadCount">
<Title its:translate="yes">Size</Title>
</Column>
<Column content-type="NumericalValue" relative-specifier="(.*):getCurrentThreadsBusy">
<Title its:translate="yes">Busy</Title>
</Column>
</MetricDataTable>
</Panel>
</SplitPane>
</ComponentDefinition>
If any of you have programmed Java Swing that may look a little bit familiar. If not, it will soon First we use a SplitPane to divide the whole display area at the ratio of 1:9. We use only 10% (0.1) for the server info. The SplitPane has exactly two children.
The first is the LiveMetricValue label for the metric ":Server Information", relative to the supported-items-specifier ("Tomcat"). We could use the same ComponentDefintion in more than one TypeViewer if the nodes contain the same metrics!
The second element is a Panel with a GridLayout that has two rows (and one column). Its first child is a Graph which displays all metrics one node below which end in "Sessions" (e.g. Activated Sessions, Expired Sessions, Invalidated Sessions).
The second child of the Panel is a MetricDataTable with three columns: the thread pool name, the total thread count and the busy count. "LastPrefixSegment" displays the last prefix of the metric name (that is matched in the other columns), i.e. the thread pool name.
By now you easily interpret the rest of the file which is attached here.
Further reading
The full guide Xml typeview tips and tricks.pdf has already been around for years. Thanks to former colleagues Sylvain Gibassier and Douglas Hilpipre!
Example typeviews
- Examine the OOTB typeviews that are deployed with the default EM.
- Take a look at some of the extensions in <EM_HOME>/examples. Some of the also come with XML typeviews
- Search the community! Several typeviewers have been uploaded:
ddtv was the old typeviews directory; xmltv is the new directory. TypeViewers will work in either since since we still have EM code that reads from both.
you can't make a pie chart in a typeviewer today.
Is there a way to tell which typeview is used in selected view when using Investigator ?
For example, which typeview is presenting "Overview" on Memory Pools or Frontends ?
I am looking for example of using show-bottom-graph="true" ...
Memory pools are from the GC Monitor typeviewer. Many of these typeviewers are wrapped in internal JAR files and can't be altered.
If you want to see some different, you'll need to create your own typeviewer to have it display at the same or different location.
There is a helpful guide in PDF format available on the community documents. Just do a search on typeviewers to begin with that.
If you have specific questions about developing typeviewers after, please open a discussion in the APM Dev group (http://bit.ly/caapm_dev).
I think I've created a typeviewer in the past with that sort of graph.
Do a search on the community documents for one of my typeviewers for either WebLogic or WebSphere.
Hi,
show-bottom-graph="true" only works for MetricDataTable. See e.g. GitHub - CA-APM/browser-agent-typeview: This typeviewer provides overviews and a stacked view of Navigation Timing API m…:
Two tables (BS-bt and BS-url) with show-bottom-graph="false": no graphs, no checkboxes in the first column:
One table (BRTM-browser-table) with show-bottom-graph="true": checkboxes on the left, select rows, columns (with drop down "Select Columns to Graph") and click "Draw Graph":
Ciao,
Guenter
...seems that my attempts were working all along - in WebView.
In Workstation - still no graph...
Version of EM is 9.5.
Also, the drop down menu offers "Select Columns to Graph" - but I can only pick one Column at a time, so it is more like radio button. (or is it 9.5 specific behaviour?)
Thanks
mm
OK, I created a Typeview that properly displays the table - it populates row labels (columns 1-3 --> from metric name) and values (other columns)
SDK TypeViewer has been really helpful - no need to restart Workstation saves time.
To display a graph, I tried:
A:
show-bottom-graph=true in MetricDataTable element - true or false does not make any difference ... at least not in my case. There is no graph, not even empty.
Seems like I am missing something, although I did check other sample typeviews...
B:
If using <Graph> element I don't see how to display just selected/highlighted rows, it always displays all matching the regex like:
<Graph relative-specifier=".*:Errors Per Interval">
<Title its:translate="yes">Title XY</Title> </Graph>
I would like the graph to display only metrics from selected table rows.
You will actually need to create a graph area and specify the metrics to display.
Is it be possible to have a custom typeview to display Events? I would like to apply a filter ...
Is there a better way to filter out events?
I'm not aware that this is possible.
Florian_Cheval: can you answer this?
I have no clue. Guenter or Omar certainly have more experience with typeviews than I do.