1.1.3版本采用maskimage方式绘制词云渲染失败

[wupeiwen]

"dependencies": { "echarts": "4.1.0", "echarts-liquidfill": "2.0.0", "echarts-wordcloud": "1.1.3", "element-ui": "^2.3.8", "vue": "^2.5.2", "vue-baidu-map": "0.21.9", "vue-router": "^3.0.1" } 是不是echarts版本问题造成的？

[wupeiwen]

踩了坑，做了兼容性测试，供参考

[fnjoe]

我使用 [email protected] ， [email protected] ，maskimage的形状正常，但是textcolor配置不生效。

 "echarts": "3.2.2",
 "echarts-wordcloud": "1.0.0",

......

import echarts from 'echarts';
import 'echarts-wordcloud';
import image from './human2.png';

......

var option = {
        series: [ {
            type: 'wordCloud',
            maskImage: maskImage,
            gridSize: 2,
            sizeRange: [12, 50],
            rotationRange: [-90, 90],
            shape: 'pentagon',       
            textStyle: {
                normal: {
                    color: function () {
                        const color = 'rgb(' + [
                            Math.round(Math.random() * 160),
                            Math.round(Math.random() * 160),
                            Math.round(Math.random() * 160)
                        ].join(',') + ')';
                        return color;
                    }
                },
                emphasis: {
                    shadowBlur: 10,
                    shadowColor: '#333'
                }
            },
            data: data.sort(function (a, b) {
                return b.value  - a.value;
            })
        } ]
    };

能帮忙看下不

[wupeiwen]

@fnjoe 再次检查你的版本，应该是版本的问题，参考上方兼容性表格，祝好运

[MMDkkk]

@fnjoe 请问你解决了吗？

[fnjoe]

@MMDkkk 当时重新 install 了下依赖，就OK了，表里的兼容性是对的

[sktm4a1]

我使用 [email protected] ， [email protected] ，maskimage的形状正常，但是textcolor配置不生效。

 "echarts": "3.2.2",
 "echarts-wordcloud": "1.0.0",

......

import echarts from 'echarts';
import 'echarts-wordcloud';
import image from './human2.png';

......

var option = {
        series: [ {
            type: 'wordCloud',
            maskImage: maskImage,
            gridSize: 2,
            sizeRange: [12, 50],
            rotationRange: [-90, 90],
            shape: 'pentagon',       
            textStyle: {
                normal: {
                    color: function () {
                        const color = 'rgb(' + [
                            Math.round(Math.random() * 160),
                            Math.round(Math.random() * 160),
                            Math.round(Math.random() * 160)
                        ].join(',') + ')';
                        return color;
                    }
                },
                emphasis: {
                    shadowBlur: 10,
                    shadowColor: '#333'
                }
            },
            data: data.sort(function (a, b) {
                return b.value  - a.value;
            })
        } ]
    };

能帮忙看下不

老哥，你这里的图是个人形吗，maskImage怎么写的啊