vue-at-three

安装

npm i vue-at-three
# 或者
yarn add vue-at-three # 推荐使用

使用

// main.js
import AtThree from "vue-at-three";
import "vue-at-three/dist/at-three.css"
// 全局组件注册
Vue.use(AtThree);

示范程序

  <template>
    <div class="demo-container">
      <at-three
        ref="atThree"
        :options="options"
        @AtMouseEnter="AtMouseEnter"
        @AtMouseLeave="AtMouseLeave"
        @AtZoomUpdate="AtZoomUpdate"
      />
    </div>
  </template>

  <script>
    export default {
      name: "AtExample",
      data() {
        return {
          options: {}
        };
      },
      mounted() {},
      methods: {
        // 鼠标进入事件回调
        AtMouseEnter(_data) {
          console.log(_data);
        },
        // 鼠标离开事件回调
        AtMouseLeave(_data) {
          console.log(_data);
        },
        // 下钻/返回上级事件回调
        AtZoomUpdate(_data) {
          console.log(_data);
        },
        // 重置图层颜色
        resetColor() {
          /**
           *  调用接口方法
           *  通过 ref 拿到 AtThree 对象
           *  this.$refs["atThree"].AtThree
           *  对应的接口在 AtThree 对象里面 比如： resetColor
           */
          this.$refs["atThree"].AtThree.AtScene.ImageLayer.resetColor()
        }
      },
    };
  </script>

  <style scoped></style>

版本记录

历史版本

2.2.56

• 修复文字dom问题
• 修复多组件纹理问题
• 统一事件参数
• 排除第三方依赖

2.2.45

• 添加叠加柱状图效果
• 修复区域定位不准确问题
• 修复柱状图文字叠加问题
• 修复场景锁定修改无效问题
• 修复其他问题

2.2.39

• 修复模型显示不全
• 修复页面多组件显示问题
• 修复鼠标事件位置不准确问题
• 修复已知问题

2.2.28

• 添加debug 开关
• 添加迁徙线功能
• 接口添加 title 功能
• 添加支持2级用户区域划分

2.2.27

• 测试地图响应问题

2.2.26

• 优化地图打开时间
• 修复marker 旋转角失效问题

2.2.25

• 修复下级区划可以点击上级区划的问题
• 修复镇级用户纹理
• 修复镇级用户下钻问题
• 修复多级用户模型位置问题
• 修复场景初始化完成事件监听
• 添加调整相机角度参数
• 添加Css定位点扩散
• 添加Css圆圈扩散
• 添加柱状图多柱鼠标移入移出事件

2.2.24

• 添加动态 marker 点
• 修复移除marker style 未移除问题
• 添加 3d 柱状图多柱
• 添加 appid：4
• appid：4 增加点击选中功能
• appid：4 移除开场动画

2.2.22

• 弹窗接口添加经纬度方式

2.2.21

• 修复区划顶部颜色无法修改问题
• 添加区划面点击开关配置
• 修复动画运行抖动问题
• 修复控制台版本号
• 添加 marker 接口
• 优化 3d 饼图、文字图片气泡、重置颜色接口

Author

Gaozhiqian