Show option from visualMap of ECharts is not working when set to false

Hello All,

I am trying to integrate the following EChart to a panel template: Examples - Apache ECharts
As you can see from the official website, for visualMap, there is an option show which is false. If you switch it to true, you can see that the effect is to add the delimitation info used to define the areas in the chart.
However, in panel, the option show: false doesn’t work, as it still show the delimitation info.

Here is the code I use:

import panel as pn
pn.extension(sizing_mode="stretch_width")


echart_demo = {
    'title': {
        'text': 'Distribution of Electricity',
        'subtext': 'Fake Data'
    },
    'tooltip': {
        'trigger': 'axis',
        'axisPointer': {
            'type': 'cross'
        }
    },
    'xAxis': {
        'type': 'category',
        'boundaryGap': 'false',
        'data': ['00:00', '01:15', '02:30', '03:45', '05:00', '06:15', '07:30', '08:45', '10:00', '11:15', '12:30', '13:45', '15:00', '16:15', '17:30', '18:45', '20:00', '21:15', '22:30', '23:45']
    },
    'yAxis': {
        'type': 'value',
        'axisLabel': {
            'formatter': '{value} W'
        },
        'axisPointer': {
            'snap': 'true'
        }
    },
    'visualMap': {
        'show': 'false',
        'dimension': 0,
        'pieces': [
            {
                'lte': 6,
                'color': 'green'
            },
            {
                'gt': 6,
                'lte': 8,
                'color': 'red'
            },
            {
                'gt': 8,
                'lte': 14,
                'color': 'green'
            },
            {
                'gt': 14,
                'lte': 17,
                'color': 'red'
            },
            {
                'gt': 17,
                'color': 'green'
            }
        ]
    },
    'series': [
        {
            'name': 'Electricity',
            'type': 'line',
            'smooth': 'true',
            'data': [300, 280, 250, 260, 270, 300, 550, 500, 400, 390, 380, 390, 400, 500, 600, 750, 800, 700, 600, 400],
            'markArea': {
                'itemStyle': {
                    'color': 'rgba(255, 173, 177, 0.4)'
                },
                'data': [
                    [
                        {
                          'name': 'Morning Peak',
                          'xAxis': '07:30'
                        },
                        {
                          'xAxis': '10:00'
                        }
                    ],
                    [
                        {
                            'name': 'Evening Peak',
                            'xAxis': '17:30'
                        },
                        {
                            'xAxis': '21:15'
                        }
                    ]
                ]
            }
        }
    ]
}

echart_pane = pn.pane.ECharts(echart_demo, height=480, width=640)

template = pn.template.FastListTemplate(
    site="Demo energy consumption",
    title="",
    main=[pn.Row(echart_pane)]
)

template.servable()

And the effect can be seen here in bottom-left corner:

Any advice how to hide this “legend” are appreciated.

Thank you in advance!

Br, Sorin

Changing from a string to a boolean like this: 'show': False returns this plot

image

1 Like

Thank you, @Hoxbro - making the switch fixed the issue.

1 Like