echarts-wordcloud
echarts-wordcloud copied to clipboard
ecomfe
部分词显示不完整
如上图所示，边缘的词显示不完整。
"echarts": "^3.6.2",
"echarts-wordcloud": "^1.1.0",
const option = {
tooltip: {
show: true,
},
grid: {
top: 0,
bottom: 0,
left: 20,
right: 20,
},
series: [{
type: 'wordCloud',
gridSize: 32,
sizeRange: [24, 66],
rotationRange: [0, 0],
rotationStep: 90,
textPadding: 0,
width: '100%',
height: '100%',
drawOutOfBound: true,
textStyle: {
normal: {
color: e => {
return CATEGORY_COLORS[e.data.category]
},
fontWeight: 900,
fontFamily: 'Arial, Verdana, sans-serif',
},
},
data: this.tempData,
}],
}
期望词能显示完整。
设置为true的时候，当画布放不下的时候可以在画布之外绘制，不是这个意思吗？
@zhangya5847 不是在画布之外绘制，而是绘制的词可以超出画布边界之外。
set to true to allow word being draw partly outside of the canvas
允许词（把自身的部分）绘制在 canvas 之外
allow word bigger than the size of the canvas to be drawn
允许更大的词也能绘制（但部分绘制，也就是一部分会超出 canvas 边界，而不是在 canvas 外面绘制这些词）
是这样子的，一开始，我也是设置drawOutOfBound: false，就是在canvas画布上绘制，但是出现了词显示不完整的问题，就像上面的截图那样，边缘的词会被切掉一部分，如果被切掉的词可以超出画布显示，不就不回有被切掉的问题了吗？所以我设置drawOutOfBound: true，但是，还是不起作用，所以，我不确定问题出在哪？是这个属性不起作用，还是我的理解有误，不是这么用的。
会有不完整，所以这个选项是可选的呀。设为 false 之后应该不会有不完整的情况，我自己就在用这个可以确认此选项的效果。
至于你为什么会出现，我并不清楚。
@nightire
外容器: width 400px/ height 400px, 配置如下:
type: 'wordCloud',
shape: 'circle',
gridSize: 8,
sizeRange: [12, 22],
rotationRange: [0, 0],
rotationStep: 0.1,
drawOutOfBound: false,
// left: 0,
// top: 0,
left: 'center',
top: 'center',
width: '100%',
height: '100%',
cursor: 'cross',
// data
data: [
{
"name": "Optical Compensation, Optically Anisotropic Layer",
"value": 13
},
{
"name": "Fatty Acid Cellulose Ester Film",
"value": 10
},
{
"name": "Liquid Crystal Display Employs",
"value": 8
},
{
"name": "Degree of Propionyl Substitution",
"value": 7
},
{
"name": "Acrylic Resin",
"value": 4
},
{
"name": "Optical Compensatory Element",
"value": 3
},
{
"name": "Process for Preparation",
"value": 2
},
{
"name": "Cyclizations, Polyenine Compounds",
"value": 2
},
{
"name": "Propenylenesulfone Chromogenes DE Formule",
"value": 2
}
]
drawOutOfBound: true 显示词组数量正确，但是词超出宽度被截断 drawOutOfBound: false 显示词组数量有误（原因应该是词的宽度过长，直接不显示了）
将 drawOutOfBound设置为false。
- sizeRange设置10-100时，100个词，我仔细数了一遍，完全绘制出来的大概有50个左右。
- sizeRange设置1-10时，100词，词太小，没有完全覆盖maskImage，但是似乎100词都绘制出来了。
- sizeRange设置10-50时，100词，我没仔细数，词已经完全覆盖maskImage，似乎100词都绘制出来了。
综上，如果你的词没有完全绘制出来，试着调整一下sizeRange的值，直到你的词全部覆盖了maskImage。
将 drawOutOfBound设置为false。
- sizeRange设置10-100时，100个词，我仔细数了一遍，完全绘制出来的大概有50个左右。
- sizeRange设置1-10时，100词，词太小，没有完全覆盖maskImage，但是似乎100词都绘制出来了。
- sizeRange设置10-50时，100词，我没仔细数，词已经完全覆盖maskImage，似乎100词都绘制出来了。
综上，如果你的词没有完全绘制出来，试着调整一下sizeRange的值，直到你的词全部覆盖了maskImage。 solve
