echarts地图自定义label属性以及引入china.js

效果图:

要点1:calc函数

重点:在于mapChart的height可以写成函数以便适配不同尺寸;

        <div class="content-map">
                <div class="wai-top-box" style="width: 100%; height: 100%">
                    <div id="mapChart" style=" width: 100%; height: calc(100vh - 100px)"> 
     </div>
             </div>
       </div>

重点1:在于mapChart的height可以写成函数适配不同尺寸
要点2:要点较多
map: {
                title: {
                    text: '',
                    x: 'center',
                    textStyle: {
                        color: '#333333'
                    }
                },
                tooltip: {
                    trigger: 'item',
                    showDelay: 0,
                    transitionDuration: 0.2,
                    formatter: function (params) {
                        const value = (params.value + '').split('.');
                        const valueStr = value[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,');
                        return params.name + ': ' + (params.value ? valueStr : 0);
                    }
                },

                // 数据和类型
                series: [
                    {
                        type: 'map',
                        map: 'c
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值