前端使用maptalks，加载高德/百度地图的瓦片，太模糊不够清晰，怎么解决？

Question

当前地图展示：

想要达到地图效果：

var map = new maptalks.Map('map', {
                center: [114.06667, 22.61667],
                zoom: 14,
                minZoom: 1,
                maxZoom: 19,
                spatialReference: {
                    projection: 'baidu'
                },
                baseLayer: new maptalks.TileLayer('base', {
                    urlTemplate:
                        'https://maponline{s}.bdimg.com/tile/?qt=vtile&styles=pl&from=jsapi2_0&x={x}&y={y}&z={z}&styles=pl&scaler=1&udt=',
                    subdomains: [0, 1, 2, 3],
                }),
            });

解决，初始化地图加入
spatialReference: {
projection: 'baidu',
},

Answer 1

看看这个帖子：https://github.com/maptalks/maptalks.js/issues/941

var map = new maptalks.Map('map', {
          center: [106.569849,29.561211],
          zoom: 18,
          minZoom:1,
          maxZoom:19,
          draggable:true,
          zoomable:true,
          scaleControl:true,
          dragRotate:false,
          dragPitch:false,
          dragRotatePitch:false,
          spatialReference:{
            projection : 'baidu'
          }
      });
      const dpr = map.getDevicePixelRatio();
      const scaler = dpr > 1 ? 2 : 1;
      map.setBaseLayer(new maptalks.TileLayer('base', {
            // 'urlTemplate' : 'http://online{s}.map.bdimg.com/tile/?qt=vtile&x={x}&y={y}&z={z}&styles=pl&scaler=1&udt=20190702',
            'urlTemplate': `http://online2.map.bdimg.com/tile/?qt=vtile&x={x}&y={y}&z={z}&styles=pl&scaler=${scaler}&udt=20190704`,
            'subdomains'  : [0,1,2,3,4,5,6,7,8,9],
            'attribution' :  '&copy; <a target="_blank" href="http://map.baidu.com">Baidu</a>'
          }));

var map2 = new BMap.Map("map2");    // 创建Map实例
        map2.centerAndZoom(new BMap.Point(106.569849,29.561211), 18);  // 初始化地图,设置中心点坐标和地图级别
        //添加地图类型控件
        map2.addControl(new BMap.MapTypeControl({
            mapTypes:[
                BMAP_NORMAL_MAP,
                BMAP_HYBRID_MAP
            ]}));      
        map2.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放