我正在使用 zingchart 条形图。
但是在缩放后一部分图形仍然保留在 X 轴下方。
图表配置如下:
{
"graphset":[
{
"type":"bar",
"plotarea":{
"adjust-layout":true
},
"background-color":"#fff",
"plot":{
"alpha":0.9,
"border-width":1,
"border-color":"black",
"border-radius-top-left":4,
"border-radius-top-right":4,
"hoverState":{
"backgroundColor":"#909090",
"visible":true
},
"bar-width":"20px",
"bar-space":"50px",
"background-fit":"x",
"animation":{
"effect":"ANIMATION_EXPAND_BOTTOM"
}
},
"scale-x":{
"zooming":true,
"label":{
"text":"Location",
"font-color":"#000",
"font-size":"16px",
"text-align":"center"
},
"values":[" HYDERABAD"," GURGAON"," JAIPUR"," BANGALORE"," KOLKATA"],
"line-color":"#CCC",
"tick":{
"line-color":"#a6a6a6",
"line-width":1,
"visible":0
},
"guide":{
"line-color":"#666",
"line-style":"solid"
},
"item":{
"font-family":"arial",
"font-color":"#000",
"background-color":"rgba(255,255,255,.9)"
}
},
"scale-y":{
"zooming":true,
"label":{
"text":"Attrition %age",
"font-color":"#2B776C",
"font-size":"16px"
},
"line-color":"#CCC",
"tick":{
"visible":false
},
"guide":{
"line-style":"dashed",
"line-color":"#ccc"
},
"item":{
"font-family":"arial",
"font-color":"#8B8B8B"
},
"zoom-to":[30.5,34.5]
},
"series":[
{
"values":[32.76,33.98,33.78,32.84,30.53],
"background-color":"#6cebb3",
"marker":{
"background-color":"#6cebb3",
"size":5
},
"value-box":{
"font-color":"#6cebb3",
"visible":true
},
"tooltip":{
"background-color":"#6cebb3",
"border-color":"#fff",
"border-width":1,
"border-radius":3,
"wrap-text":true,
"alpha":0.8,
"text":"%node-value % chances in 60 Days for location %kl"
}
},
{
"values":[34.04,33.63,32.93,33.93,32.25],
"background-color":"#ff9b67",
"marker":{
"background-color":"#ff9b67",
"size":4
},
"value-box":{
"font-color":"#ff9b67",
"visible":true
},
"tooltip":{
"background-color":"#ff9b67",
"border-color":"#fff",
"border-width":1,
"border-radius":3,
"wrap-text":true,
"alpha":0.8,
"text":"%node-value % chances in 60 Days for location %kl"
}
},
{
"values":[33.5,33.08,32.93,33.13,33.73],
"background-color":"#ff3b3b",
"marker":{
"background-color":"#ff3b3b",
"size":3
},
"value-box":{
"font-color":"#ff3b3b",
"visible":true
},
"tooltip":{
"background-color":"#ff3b3b",
"border-color":"#fff",
"border-width":1,
"border-radius":3,
"wrap-text":true,
"alpha":0.8,
"text":"%node-value % chances in 60 Days for location %kl"
}
}
]
}
]
}
如何删除它?
最佳答案
将属性“maskTolerance: [0, 0]”添加到您的 plotarea 对象。这会从您的绘图区域中切断任何多余的绘图。
关于javascript - 放大zingchart条形图后,如何删除X轴下方的部分图形?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36784853/