mars3d.MaterialType.Image2修改配置面状:图片2的speed数值实现动画效果说明

摘要:

mars3d.MaterialType.Image2修改配置面状:图片2的speed数值实现动画效果说明

前提:

1.在示例中,尝试给mars3d.MaterialType.Image2材质的图片加上speed参数,实现动画效果,但是没有看到流动效果说明。

2.相关示例地址:

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

3.相关代码::

      const wall = new mars3d.graphic.WallPrimitive({positions: options.positions,style: {setHeight: -20000,diffHeight: 20000, // 墙高width: 10,materialType: mars3d.MaterialType.Image2,materialOptions: {image: "./img/textures/fence-top.png",color: "#0b88e3",speed: 5}}})graphicLayer.addGraphic(wall)

问题描述:

1.参考api文档说明,speed不为0时呈现图片滚动效果,数字代表滚动速度,此时应该是有滚动的动画效果的,但是示例中修改后并没有看到动画效果。

2.参数如果是生效的话,那么就调试材质贴图的其他参数,例如image,在示例的map.js文件中搜索到流动线的材质,示例地址:

下载示例git clone https://gitee.com/marsgis/mars3d-vue-example.git

相关代码:

 const feijiPath = new mars3d.graphic.PathEntity({position: property,style: {width: 6,leadTime: 0, // 前方的路线不显示materialType: mars3d.MaterialType.LineFlow,materialOptions: {color: getTeamColor(team),repeat: new Cesium.Cartesian2(2.0, 1.0),image: "img/textures/line-gradual.png",speed: 15}},model: {url: "//data.mars3d.cn/gltf/mars/zhanji.glb",scale: 0.01,minimumPixelSize: 50,show: true},billboard: {show: false,image: "img/icon/plane_blue.png",color: getTeamColor(team),scale: 0.2,distanceDisplayCondition: true,distanceDisplayCondition_near: 90000,distanceDisplayCondition_far: Number.MAX_VALUE}})graphicLayer.addGraphic(feijiPath)

替换了image后的ars3d.MaterialType.Image2,效果:👇👇👇👇👇👇👇👇

关键代码:

 const wall = new mars3d.graphic.WallPrimitive({positions: options.positions,style: {setHeight: -20000,diffHeight: 20000, // 墙高width: 10,materialType: mars3d.MaterialType.Image2,materialOptions: {image: "img/textures/line-gradual.png",color: "#0b88e3",speed: 5}}})graphicLayer.addGraphic(wall)

 

思路参考:

1.materialType有很多的类型,具体类型不生效是由多个参数共同决定的。

2.例如流动的动画效果,可能需要image有要求,有的图片可能不符合speed要求,无法肉眼看到效果,此时可以考虑替换示例中的其他材质图片进行测试

3.我们官网的仓库代码中同样提供了很多的材质效果参考,地址:mars3d-react-example: Mars3D功能示例React版本 - Gitee.com

 

4.这些图片都是开源供大家免费使用的,因此希望大家能够多多学习示例,多跑代码多看效果,对相关概念有所了解,学会自己调试。一起进步🌹🌹🌹🌹🌹🌹

5. 替换流动效果时候,如果找不到相关的关键字,可以在MaterialType下面搜索speed,看还有什么材质下面有这个参数,我们的api与示例均有相关示例参考的。

 

结束语:

请大家多多学习示例与开发教程,api文档可以当成字典查询。

一起学习一起进步

祝大家工作顺利、生活愉快、开开心心赚大钱。🌹🌹🌹🌹🌹🌹🌹🌹🌹🌹🌹

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/809164.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

去掉el-date-picker弹窗默认回显当前月份的方法

打开日期弹窗,默认会显示当前月份,如图 会发现加了穿透::v-deep 样式也不生效 .el-month-table .today .cell {color: pink;font-weight: 400;}要让 popper-class“xclass” :append-to-body“false” 这俩配合着使用…

界面设计【1】-项目的UI设计css

引言: 本篇博客对简单的css html界面设计做了简要介绍 这篇博客主要就是介绍了做横向项目中,CSS界面设计与优化。 界面设计【1】-项目的UI设计css 1. 什么是css?2. css编程demo3. 可视化效果 1. 什么是css? CSS是层叠样式表(Cascading S…

每日一题 — 将 x 减到 0 的最小操作数

思路: 题目要求是让我们从数组的最左端和最右端进行操作,这样的话解题的难度大大提升,我们可以用 正难则反 的思想: 题目中要求是减去数组中的数刚好等于X,我们可以转换成 数组中某一段的和等于 数组的总长减去X(sum -…

Godot插值、贝塞尔曲线和Astar寻路

一、插值 线性插值是采用一次多项式上进行的插值计算&#xff0c;任意给定两个值A和B&#xff0c;那么在A和B之间的任意值可以定义为&#xff1a;P(t) A * (1 - t) B * t&#xff0c;0 < t < 1。 数学中用于线性拟合&#xff0c;游戏应用可以做出跟随效果&#xff08;…

vivado FFT IP核使用

matlab生成正弦函数 采样点数为512&#xff0c;每个采样点位宽为16位&#xff0c;其中最高位为符号为&#xff08;0正&#xff0c;1负&#xff09;。换句话说&#xff0c;如果用ROM存储正弦函数的coe文件的话&#xff0c;ROM ip核的位宽设置为16&#xff0c;深度为512. clear…

5G智慧港口简介(二)

5G 技术赋能智慧港口 5G 标准的制定是一个不断发展和完善的过程:第一版国际标准(Rel-15)已全部完成,第二版增强标准(Rel-16)正在制定中,预计 2020 年 3 月完成,面向演进的 Rel-17 标准已启动技术布局,进入立项规划阶段。 5G 是一张具备大速率、大连接、低时延的网络…

Vue ElementUI el-input-number 改变控制按钮 icon 箭头为三角形

el-input-number 属性 controls-position 值为 right 时&#xff1b; <el-input-number v-model"num" controls-position"right" :min"1" :max"10"></el-input-number>原生效果 修改后效果 CSS 修改 .el-input-number…

【LeetCode热题100】41. 缺失的第一个正数(数组)

一.题目要求 给你一个未排序的整数数组 nums &#xff0c;请你找出其中没有出现的最小的正整数。 请你实现时间复杂度为 O(n) 并且只使用常数级别额外空间的解决方案。 二.题目难度 困难 三.输入样例 示例 1&#xff1a; 输入&#xff1a;nums [1,2,0] 输出&#xff1a;3…

g++ 13.2.0 编译 C++模块

创建并使用自己的C模块&#xff08;Windows10MSVC&#xff09;-CSDN博客 在这篇文章中使用的是MSVC来编译模块和使用模块的代码&#xff0c;现在换g再来编译一次。 环境&#xff1a; ubuntu 23.10 sharpsharp-vbox ~> g --version g (Ubuntu 13.2.0-4ubuntu3) 13.2.0 C…

深度学习——离线数据增强——图片resize

因为有一批数据有点儿小&#xff0c;数据质量不佳&#xff0c;为了标注方便使用数据增强将数据固定在1080P&#xff0c;方便标注&#xff0c; # -*- coding: UTF-8 -*- """ Project &#xff1a;yolov5_relu_fire_smoke_v1.4 IDE &#xff1a;PyCharm Au…

STM32电机控制SDK介绍

目录 一、STM32 MC SDK包含以下项目&#xff1a; 二、电机控制应用流程 三、 MC 软件应用程序设计工作流程 四、STM32 MC固件 五、PMSM FOC 库 一、STM32 MC SDK包含以下项目&#xff1a; STM32 MC firmwareSTM32 MC WorkbenchSTM32 MC Board ManagerSTM32 Motor PilotTh…

项目从 Mysql切换 PostgreSQL 改造及踩坑记录

0、前言 原项目框架 SpringBoot MybatisPlus Mysql 1、切换流程 1.1、项目引入postgresql驱动包 由于我们要连接新的数据库&#xff0c;理所当然的要引入该数据库的驱动包&#xff0c;这与mysql驱动包类似 <dependency><groupId>org.postgresql</groupId…

MongoDB常用命令总结

《【快捷部署】017_MongoDB&#xff08;6.0.14&#xff09;》 讲述了如何快捷部署MongoDB&#xff0c;今天我们来总结一下MongoDB常用的shell命令。 一、基本操作&#xff08;CRUD&#xff09; #创建集合&#xff0c;名为 users db.createCollection("users")# 插入…

免费搭建幻兽帕鲁服务器(Palworld免费开服教程)

随着互联网技术的不断发展和普及&#xff0c;网络游戏已经成为了人们休闲娱乐的重要方式之一。而在众多网络游戏中&#xff0c;幻兽帕鲁以其独特的游戏设定和玩法&#xff0c;吸引了大量玩家的关注。为了满足广大玩家的需求&#xff0c;本文将介绍如何免费搭建幻兽帕鲁服务器&a…

Green Hills 自带的MULTI调试器查看R7芯片寄存器

Green Hills在查看芯片寄存器时需要导入 .grd文件。下面以R7为例&#xff0c;演示一下过程。 首先打开MULTI调试器&#xff0c;如下所示View->Registers&#xff1a; 进入如下界面&#xff0c;选择导入寄存器定义文件.grd&#xff1a; 以当前R7芯片举例&#xff08;dr7f7013…

Python+Appium自动化测试(ios+Android)

一、软件安装 安装清单&#xff1a; JDKPythonnode.jsandroid-sdk(作者通过Android Studio安装)iOS-deploybrewlibimobiledevice依赖库ideviceinstallercarthage依赖库 appium-doctor&#xff08;安装后可在命令行中通过命令:appium-doctor检查还少啥&#xff09; WebDriverAg…

应急响应-战中反制对抗上线CSGoby蚁剑Sqlmap等安全工具

知识点 战中-反制-安全工具篇CS反制(有版本限制) Goby反制&#xff08;有版本限制&#xff0c;新版goby已修复&#xff09; Antsword反制(有版本限制&#xff0c;别人也不一定用蚁剑) AWVS反制(有版本限制&#xff0c;在awvs 10版本存在&#xff09; BURP反制(有版本限制&…

基于python的天气数据可视化系统、Flask框架,爬虫采集天气数据,可视化分析

系统介绍 基于Python的天气预测可视化分析系统&#xff0c;该项目的主要流程和功能包括&#xff1a; 数据获取&#xff1a; 使用Python的pandas库从2345天气网&#xff08;http://tianqi.2345.com/Pc/GetHistory&#xff09;抓取山东省各市区县在2021年至2023年间的天气历史数…

C语言 | Leetcode C语言题解之第21题合并两个有序链表

题目&#xff1a; 题解&#xff1a; /*** Definition for singly-linked list.* struct ListNode {* int val;* struct ListNode *next;* };*/typedef struct ListNode ListNode; struct ListNode* mergeTwoLists(struct ListNode* list1, struct ListNode* list2) {/…

钉钉和金蝶云星空接口对接实战

钉钉和金蝶云星空接口对接实战 对接源平台:钉钉 钉钉&#xff08;DingTalk&#xff09;是阿里巴巴集团打造的企业级智能移动办公平台&#xff0c;是数字经济时代的企业组织协同办公和应用开发平台。钉钉将IM即时沟通、钉钉文档、钉闪会、钉盘、Teambition、OA审批、智能人事、钉…