QlikSense主题开发
// 主题是qliksense 2018年2月版提出,4月版正式实施,其实就是去修改sense默认的.json文件和.css文件
{
// 定义自定义主题是否从默认主题(Sense Classic)继承样式属性。JSON文件中定义的属性会覆盖继承的属性。默认ture
"_inherit": false,
//(可选) 可以在JSON文件中引用的变量。
"_variables": {
"@default": "#555555",
"@dark": "#333333",
"@light": "#eeeeee",
"@H1": "24px",
"@H2": "18px",
"@H3": "14px",
"@H4": "13px",
"@H5": "12px",
"@font-normal": "12px"
},
// (可选) 引用将在应用主题时插入的自定义样式表。
"customStyles": [{
"cssRef": "theme.css",
"classRef": "my-theme"
}],
// 字体颜色。可以通过在任何支持颜色的级别上定义颜色属性来覆盖此设置
"color": "@default",
// 字体大小。可以通过在支持fontSize的任何级别上定义fontSize属性来覆盖此设置
"fontSize": "@font-normal",
// 图表的背景颜色。可以通过在图表类型级别定义背景颜色属性来覆盖此设置。
"backgroundColor": "@light",
// 对象样式。
"object": {
// 标题属性。可以通过在图表类型级别定义title属性来覆盖此设置。
"title": {
// 主标题
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
// 副标题
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
// 脚标题
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
// 标签属性。可以通过在图表类型级别为具有标签的图表定义label属性来覆盖此设置。
// 以下图表类型支持标签属性:
// barChart 条形图 (label.name.color; label.value.fontSize)
// gauge 仪表盘 (label.name.color;)
// histogram 直方图 (label.name.color; label.value.fontSize)
// lineChart 线型图 (label.name.color; label.value.fontSize)
// pieChart 饼图 (label.name.color; label.name.fontSize;label.value.fontSize)
//scatterPlot 散点图 (label.name.color; label.value.fontSize)
// waterfallChart 瀑布图 (label.value.fontSize)
"label": {
// 标签名称属性。
"name": {
"color": "@default",
"fontSize": "10px"
},
// 标签值属性。
"value": {
"color": "@default",
"fontSize": "10px"
}
},
// 轴属性。通过在图表类型级别上为具有轴的图表(条形图,箱形图,组合图,分布图,仪表,直方图,折线图,散点图和瀑布图)定义轴属性,可以覆盖此设置。
// 对于饼图,可以覆盖axis.title并用于为尺寸标签设置样式。
"axis": {
// 轴标题属性。
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
// 轴标签属性。
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
// 轴线属性。
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
// 网格属性。无法在图表类型级别覆盖此设置。
"grid": {
// 线属性
"line": {
// 高对比度
"highContrast": {
"color": "@default"
},
// 主要
"major": {
"color": "@default"
},
// 次要
"minor": {
"color": "@default"
}
}
},
// 参考线属性。无法在图表类型级别覆盖此设置。
"referenceLine": {
// 标签属性
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
// 超出范围的属性。
"outOfBounds": {
"color": "@default",
"backgroundColor": "@default",
"fontSize": "@H6"
}
},
// 图例 通过在图表类型级别为带有图例的图表(条形图,组合图,折线图,饼图,散点图,树图,瀑布图)定义图例属性,可以覆盖此设置。
"legend": {
// 图例标题
"title": {
"color": "@default",
"fontSize": "@font-normal"
},
// 图例标签
"label": {
"color": "@default",
"fontSize": "@font-normal"
}
},
// 图表类型 这些是可以存在于对象结构中的常见图表类型属性。为每个图表列出的属性是特定的
// 大多数全局对象属性也可以在图表类型级别上定义。如果完成,则覆盖全局对象级别上设置的属性。
// 条形图
"barChart": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"legend": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
},
"label": {
"value": {
"color": "@default",
"fontSize": "@font-normal"
}
},
// 超出范围的属性。
"outOfRange": {
"color": "@default"
}
},
// 箱型图
"boxPlot": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"box": {
"whisker": {
"stroke": "@default"
},
"line": {
"stroke": "@default"
},
"box": {
"fill": "@default",
"stroke": "@default"
}
}
},
// 组合图
"comboChart": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"legend": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
}
},
// 分布图
"distributionPlot": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"box": {
"fill": "@default"
}
},
// 过滤器?
"filterpane": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
}
},
// 仪表盘
"gauge": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"label": {
"value": {
"color": "@default"
}
}
},
// 直方图
"histogram": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"label": {
"value": {
"color": "@default",
"fontSize": "40px"
}
}
},
// 指标
"kpi": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
}
},
// 线型图
"lineChart": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"legend": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
},
"outOfRange": {
"color": "@default"
},
"label": {
"value": {
"color": "@dark",
"fontSize": "@font-normal"
}
}
},
// 列表框
"listBox": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"content": {
"color": "@default",
"fontSize": "@font-normal"
}
},
// 地图
"mapChart": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
}
},
// 饼图
"pieChart": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"legend": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
},
"value": {
"fontSize": "@font-normal"
}
}
},
//数据透视表
"pivotTable": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"header": {
"fontSize": "@font-normal",
"color": "@default"
},
"content": {
"fontSize": "@font-normal",
"color": "@default"
}
},
// 散点图
"scatterPlot": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"legend": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
},
"label": {
"value": {
"color": "@default",
"fontSize": "@font-normal"
}
}
},
// 表???
"straightTable": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"header": {
"fontSize": "@font-normal",
"color": "@default"
},
"content": {
"fontSize": "@font-normal",
"color": "@default"
}
},
// 文字图片
"textImage": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
}
},
// 树形图
"treemap": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"legend": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
},
"branch": {
"backgroundColor": "@default",
"label": {
"color": "@light",
"fontSize": "@font-normal"
}
},
"leaf": {
"label": {
"fontSize": "@font-normal"
}
}
},
// 瀑布图
"waterfallChart": {
"backgroundColor": "@light",
"title": {
"main": {
"color": "@default",
"fontSize": "@font-normal"
},
"subTitle": {
"color": "@default",
"fontSize": "@font-normal"
},
"footer": {
"color": "@default",
"fontSize": "@font-normal",
"backgroundColor": "@light"
}
},
"axis": {
"title": {
"fontSize": "@font-normal",
"color": "@default"
},
"label": {
"name": {
"color": "@default",
"fontSize": "@font-normal"
}
},
"line": {
"major": {
"color": "@default"
},
"minor": {
"color": "@default"
}
}
},
"legend": {
"label": {
"fontSize": "@font-normal",
"color": "@default"
}
},
"label": {
"value": {
"fontSize": "@font-normal"
}
},
"value": {
"color": {
"default": "@default",
"dark": "@dark",
"light": "@light"
}
},
// 形状
"shape": {
"positiveValue": {
"fill": "white"
},
"negativeValue": {
"fill": "#ccccc"
},
"subtotal": {
"fill": "#000000"
},
"bridge": {
"stroke": "#333333"
}
}
}
},
// 数据颜色属性。
"dataColors": {
// 原色
"primaryColor": "blue",
// 其他色
"othersColor": "grey",
// 错误颜色
"errorColor": "red",
// 空值颜色
"nullColor": "yellow"
},
// 调色板 按维度取色范围
"palettes": {
// 数据调色板的属性。这些用于属性面板中的尺寸颜色。
"data": [{
// 可选的。调色板的名称。
"name": "First data palette",
// 显示UI中调色板名称
"translation": "12 colors",
// 调色板的标识符。必须在系统中是唯一的。
"propertyValue": "data-palette-1",
// 调色板的类型。pyramid金字塔 row 行
"type": "pyramid",
// 调色板中使用的所有颜色的定义。从上到下,从左到右缩放。
"scale": [
["#4477aa"],
["#4477aa", "#cc6677"],
["#4477aa", "#ddcc77", "#cc6677"],
["#4477aa", "#117733", "#ddcc77", "#cc6677"],
["#332288", "#88ccee", "#117733", "#ddcc77", "#cc6677"],
["#332288", "#88ccee", "#117733", "#ddcc77", "#cc6677", "#aa4499"],
["#332288", "#44aa99", "#88ccee", "#117733", "#ddcc77", "#cc6677", "#aa4499"],
["#332288", "#44aa99", "#88ccee", "#117733", "#999933", "#ddcc77", "#cc6677", "#aa4499"],
["#332288", "#44aa99", "#88ccee", "#117733", "#999933", "#ddcc77", "#cc6677", "#882255", "#aa4499"],
["#332288", "#44aa99", "#88ccee", "#117733", "#999933", "#ddcc77", "#661100", "#cc6677", "#882255", "#aa4499"],
["#332288", "#6699cc", "#44aa99", "#88ccee", "#117733", "#999933", "#ddcc77", "#661100", "#cc6677", "#882255", "#aa4499"],
["#332288", "#6699cc", "#88ccee", "#44aa99", "#117733", "#999933", "#ddcc77", "#661100", "#cc6677", "#aa4466", "#882255", "#aa4499"]
]
},
{
"name": "Second data palette",
"translation": "4 Colors",
"propertyValue": "data-palette-2",
"type": "row",
"scale": [
"#ff00ff",
"#00ff00",
"#0000ff",
"#000000"
]
}
],
// UI调色板的属性。您可以定义几个调色板,但是在颜色选择器中使用ui中定义的第一个调色板,例如,当用单色时/维度/度量/按表达式。
"ui": [{
// 调色板名称
"name": "Palette",
// UI调色板中使用的颜色。应始终定义唯一的颜色。
"colors": [
"#cccccc",
"#aaaaaa",
"#111111",
"#999999",
"#acacac",
"#dddddd",
"#eeeeee",
"#ffffff",
"#000000"
]
}]
},
// 按度量取色范围 这些是常见的配色方案属性。在“属性”面板中,缩放用于“测量颜色”。
"scales": [
{
// 配色方案名称(自定义顺序渐变)
"name": "Custom Sequential Gradient",
// 显示UI中颜色方案的名称
"translation": "Custom Sequential Gradient",
// 配色方案的属性值 sg(Sequential Gradient 顺序渐变)sc(Sequential Class顺序类)dg(Diverging gradient 发散渐变)dc(Diverging Classes 发散类)
"propertyValue": "sg",
// 配色方案的类型。gradient渐变 classes类
"type": "gradient",
// 颜色方案中包含的颜色,从左到右缩放。
"scale": ["#1A2980", "#26D0CE"]
},
{
"name": "Custom Sequential Classes",
"translation": "Custom Sequential Classes",
"propertyValue": "sc",
"type": "class",
"scale": ["#d32b1d", "#023474"]
},
{
"name": "Custom Diverging gradient",
"translation": "Custom Diverging gradient",
"propertyValue": "dg",
"type": "gradient",
"scale": ["#1A2980", "#FFFFFF", "#26D0CE", "#d32b1d"]
},
{
"name": "Custom Diverging Classes",
"translation": "Custom Diverging Classes",
"propertyValue": "dc",
"type": "class",
"scale": ["#9C824A", "#EF0107", "#DB0007", "#FFFFFF", "#023474"]
}
]
}
// 详情请参阅官方文档:https://help.qlik.com/en-US/sense-developer/February2018/Subsystems/Extensions/Content/CustomThemes/custom-themes-properties.htm?_ga=2.57217962.1673536238.1523350076-225234654.1523350076
QlikSense主题开发的更多相关文章
- QlikSense 2018.2月版起支持主题开发
自定义主题开发 // 主题是qliksense 2018年2月版提出,4月版正式实施,其实就是去修改sense默认的.json文件和.css文件 { // 定义自定义主题是否从默认主题(Sense C ...
- 黄聪:《跟黄聪学WordPress主题开发》
又一个作品完成!<跟黄聪学Wordpress主题开发>,国内最好的Wordpress主题模版开发视频教程!! 目录预览: WordPress官方源文件层式结构讲解 WordPress数据库 ...
- wordpress 主题开发
https://yusi123.com/3205.html https://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tut ...
- 学习笔记5——wp主题开发
我觉得学习wordpress插件开发之前还是得先理解一下wp的主题开发,循序渐进才能学好wordpress开发,话不多说,接下来整理一下这两天学习的wordpress主题开发的一些心得和体会,与大家一 ...
- Hexo主题开发
序章 想要一个自己的知识管理系统,用了 Hexo ,但是没有发现自己心仪的主题,就自己做了一个.本文记录了制作的全过程.本人编码功底和前端知识并不是特别雄厚,希望能由此文引出各路大神的兴趣,以后制作出 ...
- WordPress 主题开发:从入门到精通(必读)
本专栏介绍如何开发设计你自己的 WordPress 主题.如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档.本文的内容不同于应用主题,因为所讨论的是编写代码去构建你自己的主题的技术内容, ...
- vscode主题开发
vscode主题开发教程 https://blog.csdn.net/Suwanqing_su/article/details/105945290 个人配置结果 主题代码 到Vscode放插件的目录中 ...
- WordPress 主题开发 - (三) 开发工具 待翻译
Before we get started building any WordPress Theme, we’re going to need to get our development tools ...
- WordPress主题开发:开启文章缩略图功能
安装wordpress后,默认的主题里编辑文章都会看见这个缩略图功能,那么我们自己开发的新主题怎么有这个功能呢? 目录: 一.开启缩略功能 二.设置缩略图大小 三.编辑文章,上传缩略图 四.调用缩略图 ...
随机推荐
- python库之turtle(图形绘制) 开启新的快乐源泉
相信有不少人学习python 都是听了老前辈的推荐 “学python好,python有趣的代码多” 比如说画一只小狮子 这就是今天想要介绍的绘制图形库-turtle 如果也想这样画一只小狮子,或者其他 ...
- 完美激活Pycharm2019.2.3专业版
完美激活Pycharm2019.2.3专业版 Pycharm官网自9月11更新到pycharm2019.2.2版本后,在短短的2周时间与9月25又带来新版本2019.2.3,不可说更新不快,侧面可以看 ...
- linux中将video转换成gif
我使用的机器是Linux mint 17,因为习惯了在linux中开发而有时候在写小demo的时候要带一些演示,虽然可以使用录屏也可以但是视屏演示这些小demo也不是特别的方便.之前一直在linux中 ...
- css实现斜角效果
重点代码: 使用一张图片盖住div,实现斜角效果 .triangle { position: absolute; top:; left:; width: 36px; height: 36px; bac ...
- Postgressql高可用(pgpool+异步流复制)
文档结构: 由于博主之前是Oracle dba,oracle 高可用一般是rac,以及搭建ADG,一个是基于实例的高可用,一个是基于数据的容灾,甚至也有rac+adg的方式.Postgres有同步和异 ...
- window连接远程服务器报函数不支持之解决方案
1.针对window10系统 Windows+R,输入cmd,输入gpedit.msc 然后就可以启动远程连接了 2.针对window7用户 没有上述的第一个操作选项 1. 打开注册表,快捷输入 “r ...
- 队列 & 栈---概述
队列 是一种特殊的线性表,特殊之处在于它只允许在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作,和栈一样,队列是一种操作受限制的线性表.进行插入操作的端称为队尾,进行删除操作 ...
- SSH实现无密码登录
1.生成秘钥 : ssh-keygen -t rsa # -t 指定生成秘钥方式,生成秘钥过程需要三次回车 2.将生成的公钥传给 ssh 的对端 ssh-copy-id root@192.168.3. ...
- Mysql存储引擎以及锁机制
一.常用命令 1.查看引擎(默认为InnoDB) 查看mysql提供的存储引擎:show engienes 查看mysql当前默认的存储引擎:show variables like '%storage ...
- 『嗨威说』算法设计与分析 - PTA 数字三角形 / 最大子段和 / 编辑距离问题(第三章上机实践报告)
本文索引目录: 一.PTA实验报告题1 : 数字三角形 1.1 实践题目 1.2 问题描述 1.3 算法描述 1.4 算法时间及空间复杂度分析 二.PTA实验报告题2 : 最大子段和 2.1 实践题目 ...