js 怎么调用css样式,关于javascript:CSS样式如何被ThingJS平台轻松引用

React 对 CSS 封装非常简单,就是沿用了 DOM 的 style 属性对象,DOM在ThingJS技术中占有极其重要的地位。

HTML绘制立体图形能够采纳canvas标签,然而性能上只能出现2D图形,想要出现3D图像须要非凡上下文,于是引入了webGL技术。如果想看它的场景演示,能够拜访谷歌团队Data Arts出品的基于webGL的3D场景库,前端技术圈也视它为一个蓝海技术,3D开发利用遍及不可企及。

国内的物联网可视化技术厂商ThingJS纯JS语法开发,3D成果也不输于原生利用,所有源于谷歌浏览器对webgl技术的反对。从开发生态的角度,webGL技术能够调用显卡、调用麦克风、调用摄像头等所有能用的硬件去晋升服务质量,同时也反对援用js脚本和css演示,让你的3D开发成果更加有特色。

官网如何引入内部资源呢?留神在平台新建或者上传文件仅容许js, css, html, json格局。

咱们默认js脚本和css款式会带上工夫戳,且按urls数组中的程序加载,浏览器会缓存之前的js,css的版本,咱们更新了js,css文件后,浏览器不会更新。所以咱们在引入相干css、js文件时应用工夫戳,可能让浏览器加载咱们的最新版本。如下所示。

THING.Utils.dynamicLoad([

'/static/vendor/twitter-bootstrap/3.3.7/css/bootstrap.min.css',

'/static/vendor/twitter-bootstrap/3.3.7/js/bootstrap.min.js',

'/static/vendor/moment/moment.js'],

function () {

twitter-bootstrap, moment均为内部资源,因网络起因拷贝到了thingjs网站目录。

这样在平台上援用,开发不因为拜访不到资源或者拜访报错而迁延,所以咱们反对css库,JS库打包并提供官网文件夹贮存资源,确保稳固,也不便用户无论何时何地都可开发。

ThingJS官网平台反对内部资源,可操作js, css文件新建或者icon、jpg、png、gif、js、css、html、json、ttf、woff、gltf、rvt、ifc、mp3格局的文件上传。

残缺运行代码示例如下。

THING.Utils.dynamicLoad([

'/static/vendor/twitter-bootstrap/3.3.7/css/bootstrap.min.css',

'/static/vendor/twitter-bootstrap/3.3.7/js/bootstrap.min.js',

'/static/vendor/moment/moment.js'],

function () {

// 创立App

var app = new THING.App({

url: 'https://www.thingjs.com/static/models/storehouse'

});

// 加载场景后执行

app.on('load', function (ev) {

var btn = createButton();

btn.on('click', function () {

// 应用 moment 库获取以后工夫

var now = moment().format('YYYY-MM-DD HH:mm:ss');

console.log(now);

})

});

})

function createButton() {

// 应用 bootstrap 款式

var template =

`以后工夫`;

var btn = $('#div2d').append($(template));

return btn;

}

ThingJS次要为物联网小伙伴提供3D开发工具,webgl会越来越原生,3D可视化成果越来越好啦!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值