网站开发文档 php,徐州网站无障碍建设,深圳网站建设费用多少钱,深圳公众号制作摘要
双轴图表中#xff0c;柱状图无法立即显示#xff0c;并且只有在调整页面大小#xff08;放大或缩小#xff09;后才开始显示
官方示例代码
在直接复制#xff0c;替换为个人数据时#xff0c;出现柱状图无法显示问题
const config {data: [data, data],xFiel…摘要
双轴图表中柱状图无法立即显示并且只有在调整页面大小放大或缩小后才开始显示
官方示例代码
在直接复制替换为个人数据时出现柱状图无法显示问题
const config {data: [data, data],xField: time,yField: [value, count],geometryOptions: [{geometry: column,},{geometry: line,lineStyle: {lineWidth: 2,},},],};解决方法
仅需要将柱状图与折线图的配置信息位置互换即可
const dualAxesConfig {data: [overviewData, overviewData],xField: typeName,yField: [points, commitNum],width: 100%,yAxis: {// 格式化左坐标轴points: {min: 0,label: {formatter: (val) ${val}分,},},// 隐藏右坐标轴commitNum: {min: 0,},},geometryOptions: [{geometry: line,smooth: true,color: #5AD8A6,tooltip: {formatter: (a) {return { name: 提交次数, value: a.commitNum }}},},{geometry: column,color: #5B8FF9,columnWidthRatio: 0.3,label: {position: middle,},tooltip: {formatter: (a) {return { name: 积分, value: a.points }}},},],// 更改柱线交互默认为 [{type: active-region}]legend: {itemName: {formatter: (text) {return text points ? 积分 : 次数}},},interactions: [{type: element-highlight,},{type: active-region,},],onReady: (plot) {plot.on(element:click, (evt) {setPerformanceVisable(true);setSelectedType(evt.data.data.typeName);});}};