Echats世界地图由欧洲中心转为亚洲中心偏移量计算

355 阅读1分钟

image.png

我们Echats默认认定的世界地图是以欧洲为中心(既本初子午线)进行锚点的

image.png

当我们由欧洲中心的地图转换为亚洲中心的地图的时候,就产生了210度的经度偏差。

一般我们的数据记录 西经为负数而东经为整数 例如

中国台湾   经纬度:{latitude: "23.69781",longitude: "120.960515"} 
美国华盛顿 经纬度:{latitude: "37.09024",longitude: "-95.712891"}

image.png

所以我们计算偏移量的时候就应该是

let longitude = e.longitude 
if (longitude < 180 && longitude > -30) {
  longitude = longitude - 180;
} else {
  longitude = 180 + longitude;
}

如果我们需要在地图上增加自定义点位的话 我们要在外部准备一个相同尺寸的div盒子 使用相对定位进行利用百分比进行标点

  <div
          class="rank-info"
          :class="scale == index ? 'scale' : ''"
          :style="{
            left: getlocation(item.location, 0),
            top: getlocation(item.location, 1),
            'z-index': 20 - index,
          }"
          v-for="(item, index) in Place"
          :key="index">

</div>

getlocation(location, i) {
      //i=0代表经度1代表纬度
      let p = 0;
      let num = 0;
      num = location[i] * 1;
      if (i === 0) {
        if (num < 180 && num > -30) {
          num = num + 30;
        } else {
          num = 210 + 180 + num;
        }
        p = (num / 360) * 100;
      } else if (i === 1) {
        if (num < 0) {
          num = 90 + num * -1;
        } else {
          num = 90 - num;
        }
        p = (num / 180) * 100;
      }
      return p + "%";
    }