当前位置: 首页 > article >正文

单击视角复位按钮,即可看到整个地球【mars3d】

1.需要设置下初始默认视角,地图属性参数里面得

  scene: {

    center: {

这个需要拿到一个参数,可以在示例里面随便抓一个想要的右键获取下

拿到之后再设置下,参考代码之后,就可以单击视角复位按钮,就回到可以看到整个地球的效果

代码:

import * as mars3d from "mars3d"

export let map // mars3d.Map三维地图对象

// 需要覆盖config.json中地图属性参数(当前示例框架中自动处理合并)
export const mapOptions = function (option) {
  option.control = {
    homeButton: false // 方式1:options中添加控件 - 视角复位控制 控件 (Cesium原生)
  },
    option.scene = {
    center: { "lat": 64.083624, "lng": 86.163609, "alt": 15908845.9, "heading": 346.6, "pitch": -90 }
    }
  return option
}

/**
 * 初始化地图业务,生命周期钩子函数(必须)
 * 框架在地图初始化完成后自动调用该函数
 * @param {mars3d.Map} mapInstance 地图对象
 * @returns {void} 无
 */
export function onMounted(mapInstance) {
  map = mapInstance // 记录map

  // 修改控件title
  // document.getElementsByClassName("cesium-home-button")[0].setAttribute("title", "复位")

  // 方式2:在创建地球后按需调用addControl添加(直接new对应type类型的控件)
  const homeButton = new mars3d.control.HomeButton({
    title: "复位",
    icon: "img/svg/homeButton.svg",
    click: function (event) {
      console.log("HomeButton 自定义click方法")
      map.flyHome()
    }
  })
  map.addControl(homeButton)
}

/**
 * 释放当前地图业务的生命周期函数
 * @returns {void} 无
 */
export function onUnmounted() {
  map = null
}

链接地址:

功能示例(Vue版) | Mars3D三维可视化平台 | 火星科技


http://www.kler.cn/a/286341.html

相关文章:

  • QT串口通信,实现单个温湿度传感器数据的采集
  • 蓝桥备赛指南(5)
  • zookeeper-3.8.3-基于ACL的访问控制
  • arm-linux-gnueabihf安装
  • WebSocket 详解:全双工通信的实现与应用
  • 神经网络|(七)概率论基础知识-贝叶斯公式
  • Dify 与 FastGPT 流程编排能力对比分析
  • Node-RED解析巴法云/小米的传感器数据
  • ★ 算法OJ题 ★ 力扣15 - 三数之和
  • day25 Java基础——面向对象两万字详解!(纯干货)
  • wpf prism 《2》、导航
  • Linux 系统入门:高级系统管理与文本处理
  • mysql的聚簇索引、非聚簇索引、回表
  • VI设计和UI设计
  • C++初学(19)
  • nginx部署前端vue项目步骤
  • Android实现自定义方向盘-5livedata实现
  • 在SpringBoot项目中使用多线程(配合线程池)加快从MySQL导入数据到ElasticSearch的速度
  • Java 基础面试题
  • 华为od全面介绍!!!
  • 生产es所有节点全部掉线 排查
  • C++可调用对象
  • 神经网络——CIFAR10小实战
  • 如何构建大型超市数据处理系统?Java SpringBoot搭配MySQL,实现高效数据管理!
  • Axure RP10安装教程(Pro版)
  • 考试评分系统设计与实现/基于django的在线考试系统