分享
查看: 1645|回复: 0

[分享] 物联网可视化效果怎样做到最好?

[复制链接]

物联网可视化效果怎样做到最好?

发表于 2019-12-20 17:57:27 来自 分享 阅读模式 倒序浏览
zzv_icon1645 zzr_icon0 查看全部

物联网可视化这个事儿越来越多人关注和应用,可视化应用可以用在各行各业中,包括智慧校园、智慧城市、智能建筑、智慧电厂,IT运维,在这里不一一列举,物联网行业的技术人才肯定了解的比小编还多撒。那今天说说物联网可视化效果怎么做能做到最好。制作物联网可视化应用肯定要借助平台和工具的,thingjs就是面向物联网的3D可视化在线开发平台。作为技术工程师的你肯定能玩儿转,因为thingjs平台是基于webgl,使用 Javascript 语言进行开发,门槛极低,但是效果贼好,注意前端工程师都能在thingjs平台在线开发3D可视化应用哈。

物联网可视化效果怎样做到最好?
thingjs-面向物联网的3D可视化开发平台
  1. 第一人称行走.js
  2. var app = new THING.App({
  3. url: 'https://www.thingjs.com/static/models/storehouse'
  4. });
  5. app.on('load',
  6. function() {
  7. new THING.widget.Button('添加控件', add_control);
  8. new THING.widget.Button('删除控件', remove_control)
  9. });
  10. var ctrl = null;
  11. var gui = null;
  12. function add_control() {
  13. if (ctrl) {
  14. return
  15. }
  16. app.camera.position = [0, 10, 0];
  17. ctrl = app.addControl(new THING.WalkControl({
  18. walkSpeed: 0.02,
  19. turnSpeed: 0.25,
  20. gravity: 29.8,
  21. eyeHeight: 1.6,
  22. jumpSpeed: 10,
  23. enableKeyRotate: false,
  24. useCollision: false,
  25. useGravity: true
  26. }));
  27. gui = new THING.widget.Panel({
  28. 'titleText': '第一人称行走',
  29. 'hasTitle': true
  30. });
  31. gui.position = [10, 200];
  32. gui.addBoolean(ctrl, 'enableKeyRotate').caption('键盘控制旋转');
  33. gui.addBoolean(ctrl, 'useCollision').caption('碰撞检测');
  34. gui.addBoolean(ctrl, 'useGravity').caption('重力检测');
  35. gui.addNumberSlider(ctrl, 'gravity').caption('重力').step(1).min(0).max(50).isChangeValue(true);
  36. gui.addNumberSlider(ctrl, 'jumpSpeed').caption('跳起速度').step(1).min(0).max(30).isChangeValue(true)
  37. }
  38. function remove_control() {
  39. if (ctrl) {
  40. app.removeControl(ctrl);
  41. ctrl = null;
  42. gui.destroy()
  43. }
  44. }
复制代码
avatar
游客~
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

130700ppkpl8x3t7tt1b1t