Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/366.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript echarts在折线图和y轴标签之间添加填充_Javascript_Echarts - Fatal编程技术网

Javascript echarts在折线图和y轴标签之间添加填充

Javascript echarts在折线图和y轴标签之间添加填充,javascript,echarts,Javascript,Echarts,我经常在一些网页上绘制折线图。它工作得很好,但我无法在内部找到如何在折线图和y轴标签之间添加填充,以及如何将y轴标签移动到y轴分割线之间的中心 当前行echarts插件实例视图: 预期行echarts插件实例视图: 上面的屏幕截图意味着我在心里将图形从内部标签上移开,这样它们就不会相交,并将标签沿着游戏的y轴移动到分割线之间的正中间 我需要更改插件中的哪些设置才能获得与屏幕截图中相同的结果和预期结果?您可以通过不同的方式实现这一点,但大多数设置的支持成本很高,实现起来也很困难。这是一种安全

我经常在一些网页上绘制折线图。它工作得很好,但我无法在内部找到如何在折线图和y轴标签之间添加填充,以及如何将y轴标签移动到y轴分割线之间的中心

当前行echarts插件实例视图:

预期行echarts插件实例视图:

上面的屏幕截图意味着我在心里将图形从内部标签上移开,这样它们就不会相交,并将标签沿着游戏的y轴移动到分割线之间的正中间


我需要更改插件中的哪些设置才能获得与屏幕截图中相同的结果和预期结果?

您可以通过不同的方式实现这一点,但大多数设置的支持成本很高,实现起来也很困难。这是一种安全、简便的方法,但您需要注意,xAxis比系列数据有更多的点来显示差距

var myChart=echart.init(document.getElementById('main'); var选项={ 工具提示:{ 触发器:“轴” }, 网格:{ 左:“3%”, 对:"10%",, 底部:“3%”, 标签:正确 }, xAxis:{ 类型:'类别', 边界间隙:false, 数据:[1,2,3,4,5,6,7,8,9] }, 亚克斯:{ 类型:“值”, 位置:'右', axisLabel:{ 里面:对,, 差额:50, 尺寸:18 } }, 系列:[{ 键入:“行”, 区域样式:{ 颜色:“rgba(104216214,0.4)” }, 线型:{ 宽度:2, 颜色:“rgba(104216214,1)” }, 数据:[120132101134 90230210] }, ] }; myChart.setOption(选项)
您可以通过不同的方式来实现这一点,但大多数方式的支持成本很高,而且实现起来很困难。这是一种安全、简便的方法,但您需要注意,xAxis比系列数据有更多的点来显示差距

var myChart=echart.init(document.getElementById('main'); var选项={ 工具提示:{ 触发器:“轴” }, 网格:{ 左:“3%”, 对:"10%",, 底部:“3%”, 标签:正确 }, xAxis:{ 类型:'类别', 边界间隙:false, 数据:[1,2,3,4,5,6,7,8,9] }, 亚克斯:{ 类型:“值”, 位置:'右', axisLabel:{ 里面:对,, 差额:50, 尺寸:18 } }, 系列:[{ 键入:“行”, 区域样式:{ 颜色:“rgba(104216214,0.4)” }, 线型:{ 宽度:2, 颜色:“rgba(104216214,1)” }, 数据:[120132101134 90230210] }, ] }; myChart.setOption(选项)

var myChart=echart.init(document.getElementById('main'); var seriesData=Array.from({length:100},()=>Math.floor(Math.random()*5000)); var选项={ 工具提示:{ 触发器:“轴” }, 网格:{ 左:“3%”, 对:"10%",, 底部:“15%”, }, xAxis:[{ id:'xAxis1', 类型:'类别', 边界间隙:false, 数据:Array.from({length:seriesData.length},()=>Math.floor(Math.random()*100)), 轴线:{ 线型:{ 阴影偏移量X:60, }, }, }], 亚克斯:[{ 类型:“值”, 轴线:{onZero:false}, 位置:'右', 秀:没错, 轴线:{ 线型:{ 颜色:“rgba(255255,0)”, }, }, 分割线:{ 线型:{ 阴影偏移量X:60, 阴影颜色:“#ccc” } }, axisLabel:{ 间隔:0, 里面:对,, 保证金:-45, 尺寸:16, 填充:[-50,0,0,0], 颜色:'黑色', showMinLabel:false, showMaxLabel:false, }, },{ 类型:“值”, 位置:'右', 秀:没错, 抵销:59, } ], 数据缩放:[{ 类型:“内部” }, { 键入:“滑块”, 秀:没错, 底部:0 }], 系列:[{ id:'系列1', 键入:“行”, yAxisIndex:[0,1], 线型:{ 宽度:1, }, 标签:{}, 数据:系列数据, }], }; myChart.setOption(选项)

var myChart=echart.init(document.getElementById('main'); var seriesData=Array.from({length:100},()=>Math.floor(Math.random()*5000)); var选项={ 工具提示:{ 触发器:“轴” }, 网格:{ 左:“3%”, 对:"10%",, 底部:“15%”, }, xAxis:[{ id:'xAxis1', 类型:'类别', 边界间隙:false, 数据:Array.from({length:seriesData.length},()=>Math.floor(Math.random()*100)), 轴线:{ 线型:{ 阴影偏移量X:60, }, }, }], 亚克斯:[{ 类型:“值”, 轴线:{onZero:false}, 位置:'右', 秀:没错, 轴线:{ 线型:{ 颜色:“rgba(255255,0)”, }, }, 分割线:{ 线型:{ 阴影偏移量X:60, 阴影颜色:“#ccc” } }, axisLabel:{ 间隔:0, 里面:对,, 保证金:-45, 尺寸:16, 填充:[-50,0,0,0], 颜色:'黑色', showMinLabel:false, showMaxLabel:false, }, },{ 类型:“值”, 位置:'右', 秀:没错, 抵销:59, } ], 数据缩放:[{ 类型:“内部” }, { 键入:“滑块”, 秀:没错, 底部:0 }], 系列:[{ id:'系列1', 键入:“行”, yAxisIndex:[0,1], 线型:{ 宽度:1, }, 标签:{}, 数据:系列数据,