angular15怎么引入中国地图？

Question

看了现在的echarts好像没有地图了，现在下载了一个china.json该怎么用

Answer 1

Vue举例, 其实配置都差不多:

import echarts from "echarts"

      // echart 配制option  
      option: {
        tooltip: {
          show: true,
          // triggerOn: 'mousemove',   // mousemove、click
          padding: 8,
          borderWidth: 1,
          borderColor: '#1051B5',
          backgroundColor: '#F8FBFD',
          textStyle: {
            color: '#000000',
            fontSize: 13
          }
        },
        // 分段统计
        visualMap: {
          show: true,
          left: 'auto',
          right: 'auto',
          top: 'auto',
          align: 'auto',
          itemWidth: 12,
          itemHeight: 12,
          itemGap: 12,
          showLabel: true,
          orient: 'horizontal',
          inverse: true,
          pieces: [
            {
              gt: 500,
              label: '>500',
              color: '#BE2E2C'
            },
            {
              gte: 301,
              lte: 500,
              label: '301-500',
              color: '#EC5B56'
            },
            {
              gte: 101,
              lte: 300,
              label: '101-300',
              color: '#3853E2'
            },
            {
              lte: 100,
              label: '<=100',
              color: '#8BA4F8'
            }
          ]
        },
        geo: {
          map: 'china',
          scaleLimit: {
            min: 0,
            max: 2
          },
          zoom: 1,
          // roam: true,
          top: 'auto',
          left: 'auto',
          // layoutCenter: ['0%', '10%'],
          // 如果宽高比大于 1 则宽度为 100，如果小于 1 则高度为 100，保证了不超过 100x100 的区域
          // layoutSize: 300,
          // 是否显示城市名
          // label: {
          //   normal: {
          //     show: true,
          //     fontSize: 14,
          //     color: 'rgba(0,0,0,0.7)'
          //   }
          // },
          itemStyle: {
            normal: {
              // shadowBlur: 50,
              // shadowColor: 'rgba(0, 0, 0, 0.2)',
              borderColor: '#BFBFBF',
              borderWidth: 1,
              areaColor: '#EBEBEB'
            },
            // 移入背景色
            emphasis: {
              areaColor: '#B8CFF2',
              shadowOffsetX: 0,
              shadowOffsetY: 0,
              borderWidth: 0
            }
          }
        },
        series: [
          {
            name: '上市公司',
            type: 'map',
            geoIndex: 0,
            data: [],
          }
        ]
      }

// 第一个参数与gio.map要一致
echarts.registerMap('china', 地图JSON数据))