SOURCE

console 命令行工具 X clear

                    
>
console
function addScript(url) {
    let script = document.createElement('script'); script.type = 'text/javascript';
    script.src = url; document.head.appendChild(script);
}
var myChart = echarts.init(document.getElementById('ec_map'),null,{renderer:'canvas'}),option;
function loadMap(){
    let ek = document.getElementById('map_key') , key = ek.value, t = (new Date).getTime();
    if(!key){ alert('请输入地图key'); return; }
    ek.disabled = true;
    //官网地图key-可能随时失效 KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu
    addScript('https://api.map.baidu.com/getscript?v=3.0&ak='+key+'&services=&t='+t);
    myChart.showLoading();
    setTimeout(()=>{ initMap();},1000)
}
function initMap(){
    option = {
        title: {text: 'echarts-百度地图-打点', left: 'center'},
        bmap: {
            center: [116.404, 39.915], zoom: 10, roam: true
        },
        series: [
        {
            name: 'addr', symbol: 'pin',
            type: 'scatter',//散点
            coordinateSystem: 'bmap',
            data: [{"name":"北京","value":[116.46, 39.92, 79 ] }]
        }]
    };
    myChart.hideLoading();
    myChart.setOption(option);
    myChart.on('click', (params)=> {
        console.log('-->', params);
    });
    var bm = myChart.getModel().getComponent('bmap').getBMap();
    // var data = option.series[0].data;
    bm.addEventListener('click',e=>{
        console.log('地图坐标', e.point);
        //多点标记
        // data.push({"name":"标记"+data.length,"value":[e.point.lng, e.point.lat, 50 ] });
        //单点标记
        option.series[0].data = [{"name":"标记","value":[e.point.lng, e.point.lat, 50 ] }];
        myChart.setOption(option);
    })
}
<div>
    <input type="text" id="map_key" placeholder="百度地图key" value=""/>
    <button onclick="loadMap()">加载</button>
</div>
<div id="ec_map" style="height:860px;width:920px">echarts-百度地图,官方示例</div>

本项目引用的自定义外部资源