首先安装好mysql，将监控的日志数据写入到mysql之中。如下图：
好了，这里就已经准备好了相关的测试模拟数据。那么下面就使用Grafana来配置图表看看。
如果有不清楚Grafana怎么安装的朋友，可以点击 这里 查看如何安装部署。
按照脚本我已经设置好了 admin 的密码为 newpwd 了。
输入用户名 admin 和 密码 newpwd ，点击 Log In 登录系统。
在登陆系统后的首页，就可以进行数据源的添加了。
访问不了 localhost:3306 的原因是因为Grafana是使用docker容器启动的，而容器当然没有部署mysql。
所以，修改mysql访问配置如下：
好了，数据源mysql已经配置好了。下一步就是配置图表的呈现了。
下面来编写一个SQL查询来看看。
从上图看出，从mysql中查询的结果直接就可以从Grafana表格呈现了。
好了，基本上table表格已经呈现，但是单纯这样的一个表格满足不了我的胃口。
那么下面就来再整一个曲线图来看看。
我不是想单独增加一个新的面板，而是想在刚刚创建的table上面创建一个曲线图，那么该怎么做呢？
从上这个图表的配置我一开始也没太理解清楚，配置过后，看着图表呈现就更加好的理解了。
根据图表的内容，我查询的分析如上图。
当然还可以呈现更加多的图表，这里就基本介绍到这里啦。
public class CategoryItemChart {public static String generateBarChart(HttpSession session, PrintWriter pw,int w, int h,ArrayList list) {
String filename = null
try {
CategoryDataset dataset = createDataset(list)
JFreeChart chart = ChartFactory.createBarChart(
"",//图表标题
"",//X轴标题
"",//Y轴标题
dataset,//数据集合
PlotOrientation.VERTICAL,//图表显示方向（水平、垂直）
true,//是否使用图例
true,//是否使用工具提示
false//是否为图表增加URL
)
/*------------配置图表属性--------------*/
chart.setBackgroundPaint(Color.white)// 1,设置整个图表背景颜色
CategoryPlot plot = chart.getCategoryPlot()/*------------设定Plot参数-------------*/
plot.setBackgroundPaint(Color.white)// 2,设置详细图表的显示细节部分的背景颜色
plot.setDomainGridlinePaint(Color.black)// 3,设置垂直网格线颜色
plot.setDomainGridlinesVisible(false)// 4,设置是否显示垂直网格线
plot.setRangeGridlinePaint(Color.yellow)// 5,设置水平网格线颜色
plot.setRangeGridlinesVisible(false)//6,设置是否显示水平网格线
/*---------将所有数据转换为整数形式---------*/
final NumberAxis rangeAxis = (NumberAxis) plot.getRangeAxis()
rangeAxis.setStandardTickUnits(NumberAxis.createIntegerTickUnits())
/*---------设置是否在柱图的状态条上显示边框----*/
CategoryItemRenderer renderer = (CategoryItemRenderer) plot.getRenderer()
BarRenderer render = (BarRenderer) plot.getRenderer()
// render.setItemMargin(0.0)
// render.setMinimumBarLength(0.0)
/*---------设置状态条颜色的深浅渐变-----------*/
GradientPaint gp0 = new GradientPaint(0.0f, 0.0f, new Color(255,200, 80), 0.0f, 0.0f, new Color(255, 255, 40))
GradientPaint gp1 = new GradientPaint(0.0f, 0.0f, new Color(50,255, 50), 0.0f, 0.0f, new Color(100, 255, 100))
GradientPaint gp2 = new GradientPaint(0.0f, 0.0f, Color.red, 0.0f,0.0f, new Color(255, 100, 100))
GradientPaint gp3 = new GradientPaint(0.0f, 0.0f, new Color(108,108, 255), 0.0f, 0.0f, new Color(150, 150, 200))
renderer.setSeriesPaint(0, gp0)
renderer.setSeriesPaint(1, gp1)
renderer.setSeriesPaint(2, gp2)
renderer.setSeriesPaint(3, gp3)
/*
*
* 解决柱状体与图片边框的间距问题
*
*
* */
/*------设置X轴标题的倾斜程度----*/
CategoryAxis domainAxis = plot.getDomainAxis()
domainAxis.setCategoryLabelPositions(CategoryLabelPositions.createUpRotationLabelPositions(Math.E / 6.0))
/*------设置柱状体与图片边框的左右间距--*/
domainAxis.setLowerMargin(0.06)
domainAxis.setUpperMargin(0.06)
/*------设置柱状体与图片边框的上下间距---*/
ValueAxis rAxis = plot.getRangeAxis()
rAxis.setUpperMargin(0.3)
rAxis.setLowerMargin(0.3)
/*---------设置每一组柱状体之间的间隔---------*/
render.setItemMargin(0.01)
/*
*
* 解决柱状体与图片边框的间距问题
*
*
* */
/*
*
*
* 解决JFREECHART的中文显示问题
*
*
* */
/*----------设置消除字体的锯齿渲染（解决中文问题）--------------*/
chart.getRenderingHints().put(RenderingHints.KEY_TEXT_ANTIALIASING,RenderingHints.VALUE_TEXT_ANTIALIAS_OFF)
/*----------设置标题字体--------------------------*/
TextTitle textTitle = chart.getTitle()
textTitle.setFont(new Font("黑体", Font.PLAIN, 20))
/*------设置X轴坐标上的文字-----------*/
domainAxis.setTickLabelFont(new Font("sans-serif", Font.PLAIN, 11))
/*------设置X轴的标题文字------------*/
domainAxis.setLabelFont(new Font("宋体", Font.PLAIN, 12))
/*------设置Y轴坐标上的文字-----------*/
rAxis.setTickLabelFont(new Font("sans-serif", Font.PLAIN, 14))
/*------设置Y轴的标题文字------------*/
rAxis.setLabelFont(new Font("黑体", Font.PLAIN, 12))
/*---------设置柱状体上的显示的字体---------*/
renderer.setBaseItemLabelFont(new Font("宋体", Font.PLAIN, 12))
renderer.setBaseItemLabelGenerator(new LabelGenerator(0.0))
renderer.setBaseItemLabelsVisible(true)
/*
*
*
* 解决JFREECHART的中文显示问题
*
*
* */
/*------得到chart的保存路径----*/
ChartRenderingInfo info = new ChartRenderingInfo(new StandardEntityCollection())
filename = ServletUtilities.saveChartAsPNG(chart, w, h, info,session)
/*------使用printWriter将文件写出----*/
ChartUtilities.writeImageMap(pw, filename, info, true)
pw.flush()
} catch (Exception e) {
System.out.println("Exception - " + e.toString())
e.printStackTrace(System.out)
filename = "public_error_500x300.png"
}
return filename
}
/*-------------设置柱状体顶端的数据显示--------------*/
static class LabelGenerator implements CategoryItemLabelGenerator {
private double threshold
public LabelGenerator(double threshold) {
this.threshold = threshold
}
public String generateLabel(CategoryDataset dataset, int row, int column) {
String result = null
final Number value = dataset.getValue(row, column)
if (value != null) {
final double v = value.doubleValue()
if (v >this.threshold) {
result = value.toString()
}
}
return result
}
public String generateRowLabel(CategoryDataset dataset, int row) {
return null
}
public String generateColumnLabel(CategoryDataset dataset, int column) {
return null
}
}
/*-----------数据封装-------------*/
private static CategoryDataset createDataset(ArrayList list) {
String s1 = "1"
String s2 = "2"
String c1 = "1"
String c2 = "2"
DefaultCategoryDataset dataset = new DefaultCategoryDataset()
dataset.setValue(44, s1, c1)
dataset.setValue(48, s2, c2)
return dataset
}
}
比较完整的一个得到柱图的代码，保存路径是临时文件，怎么从数据库取值应该会吧。把dataset处理一下就可以了。
//参考这个最基本的吧：<?php
$link = mysql_connect('localhost', 'root', '123456')
mysql_select_db('youdatabase', $link)
$result = mysql_query('SELECT id, title FROM table', $link)
?>
<html>
<head>
<title>文章列表</title>
</head>
<body>
<h1>文章列表</h1>
<ul>
<?php while ($row = mysql_fetch_assoc($result)): ?>
<li>
<a href="/show.php?id=<?php echo $row['id'] ?>">
<?php echo $row['title'] ?>
</a>
</li>
<?php endwhile ?>
</ul>
</body>
</html>
<?php
mysql_close($link)
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）