【控件】mars3d控件的设置

小小的杰茜

已于 2023-02-20 14:54:41 修改

阅读量2.4k

点赞数

分类专栏： vue3.0 mars3d 文章标签：前端 html

于 2022-06-24 13:01:40 首次发布

本文链接：https://blog.csdn.net/m0_53584457/article/details/125443247

版权

mars3d 同时被 2 个专栏收录

38 篇文章 5 订阅

订阅专栏

11 篇文章 0 订阅

订阅专栏

本文介绍了如何在编程中通过获取控件的DOM元素来实现对其样式的独立设置，包括更换图片、添加文字以及修改其他样式。通过控制`toolButton.container`和`toolButton.container.firstChild`，可以实现对控件图片和文字的动态更新。同时，还提及了显示隐藏控件的方法以及获取父元素的可能性，提供了深入定制用户界面的实践指导。

摘要由CSDN通过智能技术生成

添加一个控件，想要单独的设置样式，然后发现，可以获取到这个控件的dom元素

 const toolButton = new mars3d.control.ToolButton({
    title: "示例按钮bookmark",
    icon: "图片路径",
    insertIndex: 1, // 插入的位置顺序, 1是home按钮后面
    click: () => {
       // 控件的dom元素
      console.log(toolButton.container)

      // dom元素里面的第一个子元素，通常是控件的图片，可以直接修改src更换图片
      console.log(toolButton.container.firstChild) 
    }
  })
  map.addControl(toolButton)

更换图片