Skip to content

symbolSize如何自定义hover时的大小 #10033

@zaiMoe

Description

@zaiMoe

Version

3.7.2

Reproduction link

https://www.echartsjs.com/examples/editor.html?c=scatter-punchCard

Steps to reproduce

复制并替换成下面的代码,然后悬停在某个symbol上:

var hours = [];

var date = new Date();
var time = date.getTime();

for (var n = 0; n < 100; n++ ) {
    // hours.push(time   1000 * 60 * 60 * n);
    hours.push(n+1)
}

var days = ['Saturday', 'Friday', 'Thursday',
    'Wednesday'];

var data = [];

for (var i = 0; i < 4; i++) {
    for (var j = 0; j < hours.length; j++ ) {
        data.push([j, i, Math.random() * 10])
    }
}

option = {
    tooltip: {
        formatter: function (params) {
            return params.value[2];
        }
    },
    xAxis: {
        type: 'category',
        data: hours,
        boundaryGap: false,
        axisLine: {
            show: true
        }
    },
    yAxis: {
        type: 'category',
        data: days,
        axisLine: {
            show: true
        }
    },
    series: [{
        name: 'Punch Card',
        type: 'scatter',
        symbol: 'rect',
        symbolSize: function (val) {
            return [1, 20];
        },
        data: data,
        animationDelay: function (idx) {
            return idx * 5;
        }
    }]
};

What is expected?

能自定义symbolSize

What is actually happening?

symbolSize在hover时的放大比例不受控


散点图自定义了symbol:rect, symbolSize: [1, 20]
导致hover的时候放大比例异常,目前通过设置hoverAnimation: false和itemStyle.emphasis来简单的实现hover变化,有其他更好的解决方法吗?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions