bizcharts 图表内容居中
当图表内的数据只有一组时,会紧靠在y轴上,如下图:

想要图表的内容居中,解决方法分两种情况。
第一种:如果x轴是日期,则代码设置如下,图表的内容就居中了
const cols = {
x: {
alias: "日期",
type: "timeCat",
mask: "MM-DD",
}
value: {
max:200,
min: 0,
},
};
<Chart height={height} padding={padding} data={dv} scale={cols} forceFit></Chart>

第二种:如果x轴是单纯的年份,则代码设置如下,图表的内容就居中了
const cols = {
x: {
}
value: {
max:200,
min: 0,
},
};
<Chart height={height} padding={padding} data={dv} scale={cols} forceFit></Chart>

上面的两种情况也可以加
x: {
alias: "日期",
type: "timeCat",
mask: "MM-DD",
range: data.length > 1? [0, 1]: [0.5, 1],
}
或者
x: {
range: data.length > 1? [0, 1]: [0.5, 1],
}
bizcharts 图表内容居中的更多相关文章
- 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码
原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...
- android RelativeLayout 内容居中解决办法
android RelativeLayout 内容居中解决办法: 使用Linearlayout本来利用父控件的gravity属性是很好解决的.但是对应RelativeLayout虽然有 gravi ...
- div中的内容居中
要使div中的内容居中显示,不仅div要设定“text-align:centr" ,内置对象要添加margin:auto;属性才能使其在firefox等其他浏览器中也能居中.
- gridcontrol显示行号,总行,打印,导出Excel,设置标头及内容居中方法
1.一般为了表格显示数据更直观,经常会显示行号以及总数.让gridcontrol显示行号,首先你需要设置一下显示行号的宽度,也就是IndicatorWith.默认值为-1,可根据实际数值需要设置宽度, ...
- HTML 文本内容居中
简单描述:使用bootstrap 的model弹出框,里边的标题内容是靠左的,想把内容居中. 操作:给标题的class加上"text-center". 另外 我发现,在使用mode ...
- div宽高不确定,内容居中
当div的宽高不确定时候,内容居中:// 加在父级div中 垂直居中:align-items:center; display: -webkit-flex;水平居中:justify-content:ce ...
- div居中与div内容居中,不一样
1.div自身居中 使用margin:0 auto上下为0,左右自适应的css样式. 要让div水平居中,那么除了设置css margin:0 auto外,还不能再设置float,不然将会导致div靠 ...
- DataGridView列标题居中,内容居中
//列标题居中 dataGridView1.ColumnHeadersDefaultCellStyle.Alignment = DataGridViewContentAlignment.MiddleC ...
- JQuery datatables 标题和内容居中显示
1.如题,使用到了强大的表格插件datatables,要使标题和内容都居中显示,只需要在jsp引入css,写上如下内容即可: /*qiulinhe:2016年11月7日13:48:26*/ /* da ...
随机推荐
- 海关单一窗口程序出现网络/MQ问题后自动修复处理
单一窗口切换了2年多了,由于RabbitMQ或者网络的不稳定,或者升级或者网络调整,等等诸多问题导致了海关单一窗口程序会不定期的出现文件及回执自动处理的作业停止的问题. 最近终于想明白了,把日志监控起 ...
- python3的hashlib库sha256、pbkdf2_hmac、blake2b基本用法
hashlib.sha256: import hashlib x = hashlib.sha256()x.update(b"asd")print("x_1 = " ...
- 原生JavaScript HTML DOM Style 对象参考
Style 对象属性 可以在Style对象上使用以下属性: “CSS”列指示定义属性的CSS版本(CSS1,CSS2或CSS3). 属性 描述 CSS alignContent 当项目不使用所有可用空 ...
- Vue中iframe和组件的通信
最近的项目开发中用到了Vue组件中嵌套iframe,相应的碰到了组件和HTML的通信问题,场景如下:demo.vue中嵌入 test.html 由于一般的iframe嵌套是用于HTML文件的,在vue ...
- maven 学习---使用Maven构建项目
要构建一个基于Maven的项目,打开控制台,进入到 pom.xml 文件所放的项目文件夹,并发出以下命令: mvn package 这将执行Maven的“package”阶段. Maven构建生命周期 ...
- Struts2 运行流程
Struts2运行流程 1.在web.xml中使用Struts的核心过滤器拦截所有请求. <filter> <filter-name>struts2</filter-na ...
- Unity导出Gradle工程给Android Studio使用
1 Unity导出Gradle项目 Unity打包时Build System选择Gradle,勾选Export Project 2 Android Studio导入Unity导出的Gradle项目 打 ...
- bootstrap的表单form
(1)默认表单 <form> <div class="form-group"> <label class="control-label&qu ...
- RabbitMQ启动报unknown exchange type 'x-delayed-message'
RabbitMQ延迟队列插件未安装,导致以下问题: ShutdownSignalException: connection error; protocol method: #method<con ...
- day 35
目录 单表操作 分组 group by having order by limit 使用顺序 多表操作 外键 一对多 多对多 一对一 多表联查 单表操作 分组 group by 分组指的是:将所有记录 ...