社区
JavaScript
帖子详情
echarts怎么把y轴的上下都设置成正数???
nm_gc
2016-10-14 06:21:18
把零下的负数,也变成正数显示
...全文
3489
4
打赏
收藏
echarts怎么把y轴的上下都设置成正数???
把零下的负数,也变成正数显示
复制链接
扫一扫
分享
转发到动态
举报
AI
作业
写回复
配置赞助广告
用AI写文章
4 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
qq_35261034
2018-03-28
打赏
举报
回复
1. 首先改X轴负坐标轴的显示: xAxis : [ { type : 'value', axisLabel:{ formatter:function(value){ if (value<0) { return -value; } } } }], 2. 改X轴负坐标上方图表显示: series : [ { name:'XXX', type:'bar', stack: '总量', label: { normal: { show: true, formatter: function (value) { if(value.data<0){ return -value.data; } }, } }, data:[-70, -172, -105, -367, -116, -279, -259,-248,-346,-115,-119] } 3. 改鼠标悬浮提示值: tooltip : { trigger: 'axis', axisPointer : { // 坐标轴指示器,坐标轴触发有效 type : 'shadow' // 默认为直线,可选为:'line' | 'shadow' }, formatter:function(params){ // 改鼠标悬浮提示值格式 var relVal = params[0].name+"<br/>"; relVal += params[0].seriesName+ ' : ' + (-params[0].value) +"<br/>"; relVal += params[1].seriesName+ ' : ' +params[1].value+"<br/>"; return relVal; } }
ocean3516
2017-05-18
打赏
举报
回复
4
设置 yAxis.axisLabel.formatter属性即可 yAxis: { axisLabel:{ formatter:function (value, index) { if(value<0){ return -value; }
肆意的青春,动荡的年华
2016-12-27
打赏
举报
回复
yAxis加个属性minInterval: 1
撕裂石头
2016-10-21
打赏
举报
回复
我也遇到类似的问题,求大神指教。
[size=24px]
[/size]
echarts
正负条形图将都
设置成
正数
html + js <!-- THIS EXAMPLE WAS DOWNLOADED FROM https://
echarts
.apache.org/examples/zh/editor.html?c=bar-background --> <!DOCTYPE html> <html style="height: 100%"> <head> <meta charset="utf-8"> </head>
echarts
柱形图倒立,上下都是
正数
(2)
//在建项目分布柱状图2 proHoursBar2Option = { title: { // text: '材价频率分布图', x: 15, y: 15, textStyle: { //标题文字设置 fontSize: '12', fontWeight: 'normal',
Echarts
正负条形图将x轴都
设置成
正数
最近在做项目的时候需要用到
Echarts
的正负条形图,但是条形图的左半部分的数值是负数的,但是我们需要他也是
正数
的,话不多说,先上效果图: 所以需要做如下几步修改: 首先需要修改x轴上面显示为负数的刻度标签,找到xAxis[i].axisLabel,重写他的formatter,代码如下所示: xAxis: [ { type: 'value', axisLabel: { ...
[
Echarts
的
Y轴
文字居中]
实现对称的
Echarts
柱状图样式,及
y轴
文字居中 主要实现的是如下图的页面样式,文字居中是采用
y轴
的偏移offset,不是特别完美,需要手动调节,图片下面时代码。 下面展示一些 内联代码片。 <template> <div class="pic" style="height: 100%; width: 100%"> <div ref="bc" style="height: 100%; width: 100%" /> </div> &
实现正负值及多条
Y轴
Echarts
柱状图
正负值及多条
Y轴
话不多说,直接上代码 let xData = ['语文', '数学', '英语', '地理', '物理', '化学', '生物'] let yData = [320, 302, -341, -374, 390, 450, -420] let max = Math.max(...yData) // 区分正负值 let emptyData = yData.map((v, i) => { let xColor = null if (v >= 0) {
JavaScript
87,997
社区成员
224,709
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章