当图表内的数据只有一组时,会紧靠在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>

上面的两种情况也可以加

range: data.length > 1? [0, 1]: [0.5, 1],
 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 图表内容居中的更多相关文章

  1. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  2. android RelativeLayout 内容居中解决办法

    android RelativeLayout 内容居中解决办法:   使用Linearlayout本来利用父控件的gravity属性是很好解决的.但是对应RelativeLayout虽然有 gravi ...

  3. div中的内容居中

    要使div中的内容居中显示,不仅div要设定“text-align:centr"  ,内置对象要添加margin:auto;属性才能使其在firefox等其他浏览器中也能居中.

  4. gridcontrol显示行号,总行,打印,导出Excel,设置标头及内容居中方法

    1.一般为了表格显示数据更直观,经常会显示行号以及总数.让gridcontrol显示行号,首先你需要设置一下显示行号的宽度,也就是IndicatorWith.默认值为-1,可根据实际数值需要设置宽度, ...

  5. HTML 文本内容居中

    简单描述:使用bootstrap 的model弹出框,里边的标题内容是靠左的,想把内容居中. 操作:给标题的class加上"text-center". 另外 我发现,在使用mode ...

  6. div宽高不确定,内容居中

    当div的宽高不确定时候,内容居中:// 加在父级div中 垂直居中:align-items:center; display: -webkit-flex;水平居中:justify-content:ce ...

  7. div居中与div内容居中,不一样

    1.div自身居中 使用margin:0 auto上下为0,左右自适应的css样式. 要让div水平居中,那么除了设置css margin:0 auto外,还不能再设置float,不然将会导致div靠 ...

  8. DataGridView列标题居中,内容居中

    //列标题居中 dataGridView1.ColumnHeadersDefaultCellStyle.Alignment = DataGridViewContentAlignment.MiddleC ...

  9. JQuery datatables 标题和内容居中显示

    1.如题,使用到了强大的表格插件datatables,要使标题和内容都居中显示,只需要在jsp引入css,写上如下内容即可: /*qiulinhe:2016年11月7日13:48:26*/ /* da ...

随机推荐

  1. Pytest 测试框架

    一 . Pytest 简介 Pytest是python的一种单元测试框架. 1. pytest 特点 入门简单,文档丰富 支持单元测试,功能测试 支持参数化,重复执行,部分执行,测试跳过 兼容其他测试 ...

  2. Docker 容器命令大全

    容器命令: 命令 描述 attach 将本地标准输入,输出和错误流转到到正在运行的容器 build 从Dockerfile构建映像 commit 根据容器的更改创建新镜像 cp 在容器和本地文件系统之 ...

  3. 深入理解枚举属性与for-in和for-of

    首先要分清什么是可枚举属性,什么是不可枚举属性 1.可枚举属性 在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被f ...

  4. CSS3动画实践——简易牛顿摆

    最近在练习CSS3的关键帧动画(keyframes),于是做了一个简单的牛顿摆(听名字可能陌生,但你一定见过它): 先上代码(老版本IE可能存在兼容性问题): <!DOCTYPE html> ...

  5. 新手入门必看:VectorDraw 常见问题整理大全(一)

    VectorDraw Developer Framework(VDF)是一个用于应用程序可视化的图形引擎库.有了VDF提供的功能,您可以轻松地创建.编辑.管理.输出.输入和打印2D和3D图形文件.该库 ...

  6. 2.监控软件zabbix-客户端安装

    环境准备 Zabbix-Agent只要http://www.zabbix.com/download.php中可以下载的Zabbix-Agent均可以搭建Zabbix-Agent环境,本文选用CentO ...

  7. Transformer —— attention is all you need

    https://www.cnblogs.com/rucwxb/p/10277217.html Transformer -- attention is all you need Transformer模 ...

  8. IBM LOTUS DOMINO 9 部署SSL证书

    前言 随着SHA1算法在2016年12月31日以后,将被强制淘汰,所有新的SSL证书都必须支持SHA256算法,所以我们必须将IBM Domino Server升级到9.0以上才可以支持SHA256算 ...

  9. [linux] shell脚本编程-统计日志文件中的设备号发通知邮件

    1.日志文件列表 比如:/data1/logs/2019/08/15/ 10.1.1.1.log.gz 10.1.1.2.log.gz 2.统计日志中的某关键字shell脚本 zcat *.gz|gr ...

  10. vue中webpack的配置理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...