【Splunk】自定义仪表板样式和行为

Splunk官方文档地址:Developing Views and Apps for Splunk Web

本文主要内容为自定义仪表盘样式和行为


目录


可以通过自定义.js和.css文件自定义仪表板样式和行为,你可以自定义app中的一个特定的仪表板,也可以自定义特定app中所有的仪表板。

包含自定义JavaScript文件可能会导致仪表板呈现问题。在编辑模式下打开仪表板时,您可能会看到有关自定义脚本的警告。

实践:自定义一个仪表板的样式和行为

创建自定义文件

要自定义特定的面板,首先创建一个或多个.css或.js文件来定义样式和行为。

根据仪表板所属的应用程序,将这些文件放在应用程序的appserver/static目录中,该目录位于此处:

bash 复制代码
$SPLUNK_HOME/etc/apps/<app_name>/appserver/static

例如,要自定义搜索和报告中仪表板的样式和行为,请使用此目录路径:

bash 复制代码
$SPLUNK_HOME/etc/apps/search/appserver/static

将自定义文件添加到仪表板

当自定义文件位于应用程序的appserver/static目录中时,将它们添加到仪表板中。使用以下语法:

html 复制代码
<dashboard stylesheet="<style_filename>.css"script="<script_filename>.js">

您可以为一个面板使用多个自定义文件。对于多个.css或.js文件,请使用以下语法:

html 复制代码
<dashboard stylesheet="<style_filename1>.css, <style_filename2>.css" script="<script_filename1>.js, <script_filename2>.js">

注意:表单在SimpleXML中有根元素,而不是。如果要向表单中添加自定义文件,请使用<form-stylesheet="...">。

将其他应用程序中的自定义文件添加到仪表板

您可以将自定义文件从一个应用程序的appserver/static目录添加到另一个应用的仪表板。使用此语法可以指示自定义文件的其他应用程序上下文。

html 复制代码
<dashboard stylesheet="<app_name>:<style_filename>.css"script="<app_name>:<script_filename>.js">

例如,要引用位于搜索和报告应用程序上下文中的文件,请使用以下语法。

html 复制代码
<dashboard stylesheet="search:my_custom_styles.css"script="search:mi_custom_script.js">

注意:确保自定义文件存在于指定应用程序的appserver/static目录中。当找不到文件时,不支持相关性检查和警告消息。

实践:自定义应用程序中所有仪表板的样式和行为

仪表板会自动从appserver/static目录加载dashboard.js和dashboard.css。若要自定义应用程序中所有仪表板的样式和行为,请创建以下一个或两个文件。

  • dashboard.js
  • dashboard.css

将文件放在以下目录中:

bash 复制代码
$SPLUNK_HOME/etc/apps/<app_name>/appserver/static
相关推荐
2301_79651252几秒前
【精通篇】打造React Native鸿蒙跨平台开发高级复合组件库开发系列:Sticky 粘性布局(始终会固定在屏幕顶部)
javascript·react native·react.js·ecmascript·harmonyos
Amumu121389 分钟前
CSS基础选择器
前端·css
shangyingying_115 分钟前
图像质量评价(IQA)
人工智能·python·神经网络
OPEN-Source16 分钟前
大模型 Agent 实战:多 Agent 太贵太慢?一套系统性的性能与成本优化方案
人工智能·python·agent·rag·deepseek
南囝coding16 分钟前
Claude Code 作者再次分享 Anthropic 内部团队使用技巧
前端·后端
一阵寒风17 分钟前
ComfyUI本地部署指南
开发语言·人工智能·python
高洁0124 分钟前
大模型架构演进:从Transformer到MoE
python·深度学习·机器学习·数据挖掘·知识图谱
谁不学习揍谁!26 分钟前
基于python机器学习算法的农作物产量可视化分析预测系统(完整系统源码+数据库+详细文档+论文+详细部署教程+答辩PPT)获取方式
python·算法·机器学习
OPEN-Source32 分钟前
别为多 Agent 而多 Agent:一套实用的 Agent 架构选型指南
人工智能·python·agent·rag·deepseek
ID_180079054731 小时前
Python采集京东商品详情:基于官方API的规格与价格获取
开发语言·数据库·python