react-native - 如何在胜利折线图 X 轴标签中换行或插入“换行”字符
问题描述
当胜利折线图显示 x 轴标签时,标签在一行上,我想显示带有文本换行的标签。请参阅下面的两张图片以了解它当前正在做什么以及我希望它做什么。
目前正在发生什么
下面的图片是我想要发生的事情。我想要什么
我在 tickFormat 中创建了一个函数来提供自定义标签文本,并且该部分正在工作。
<VictoryAxis fixLabelOverlap={true} tickFormat={t => this.formatLabel(t)} />
formatLabel = (t) => {
var x = new Date(t);
var s = x.getHours() + ":" + x.getMinutes() + (x.getMonth() + 1) + '/' + x.getDate();
return s;
}
解决方案
您应该能够使用换行符“\n”创建一个新行
formatLabel = (t) => {
var x = new Date(t);
var s = x.getHours() + ":" + x.getMinutes() +'\n'+ (x.getMonth() + 1) + '/' + x.getDate();
return s;
}
推荐阅读
- macos - MacOS Sur 从任何地方下载
- php - MYSQL PHP:根据地址列查找重复项
- sql - 如何将大约 5+ 百万个 id 发送到 SQL Server 存储过程以获得相应大小的总和?SQL 2012
- javascript - 按数字长度排序,然后按数字本身
- android - 华为 Map Kit onCameraIdle 方法未触发
- c++ - 配置 VS Code 代码运行器扩展以显示 CPP 警告
- java - 我的 AdMob 广告无法加载,无论是我的个人广告单元还是测试广告单元。广告加载失败 0
- inno-setup - Inno 编译器设置的 PermissionError
- reactjs - 如何在反应中使用子组件方法?
- sql-server - Excel:从 SQL Server 和云中刷新 Excel 表的最佳方式?