WebGL兼容性检查

引入文件WebGL.js

class WebGL {static isWebGLAvailable () {try {const canvas = document.createElement('canvas');return !!(window.WebGLRenderingContext && (canvas.getContext('webgl') || canvas.getContext('experimental-webgl')));} catch (e) {return false;}}static isWebGL2Available () {try {const canvas = document.createElement('canvas');return !!(window.WebGL2RenderingContext && canvas.getContext('webgl2'));} catch (e) {return false;}}static isColorSpaceAvailable (colorSpace) {try {const canvas = document.createElement('canvas');const ctx = window.WebGL2RenderingContext && canvas.getContext('webgl2');ctx.drawingBufferColorSpace = colorSpace;return ctx.drawingBufferColorSpace === colorSpace; // deepscan-disable-line SAME_OPERAND_VALUE} catch (e) {return false;}}static getWebGLErrorMessage () {return this.getErrorMessage(1);}static getWebGL2ErrorMessage () {return this.getErrorMessage(2);}static getErrorMessage (version) {const names = {1: 'WebGL',2: 'WebGL 2'};const contexts = {1: window.WebGLRenderingContext,2: window.WebGL2RenderingContext};let message = 'Your $0 does not seem to support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation" style="color:#000">$1</a>';const element = document.createElement('div');element.id = 'webglmessage';element.style.fontFamily = 'monospace';element.style.fontSize = '13px';element.style.fontWeight = 'normal';element.style.textAlign = 'center';element.style.background = '#fff';element.style.color = '#000';element.style.padding = '1.5em';element.style.width = '400px';element.style.margin = '5em auto 0';if (contexts[version]) {message = message.replace('$0', 'graphics card');} else {message = message.replace('$0', 'browser');}message = message.replace('$1', names[version]);element.innerHTML = message;return element;}}export default WebGL;

JS中使用

import WebGL from './WebGL.js';if (WebGL.isWebGLAvailable()) {// Initiate function or other initializations hereconsole.log('支持WebGL')
} else {// 不支持WebGL}

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

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

相关文章

Qt中QGraphicsView总体架构学习

前沿 前段时间学习了下如何在QGraphicsView架构中绘制刻度尺&#xff0c;主要是与OnPainter中进行比较的&#xff0c;那么今天就来详细讲解下我对QGraphicsView框架的认知吧~ 最近一段时间想学习下&#xff0c;如果我有不正确的&#xff0c;欢迎留言探讨哟~ QGraphicsView架…

[软件工具]AI软件离线表格识别工具使用教程图像转excel转表格可复制文字表格导出实时截图识别成表格

【官方框架地址】 https://github.com/PaddlePaddle/PaddleOCR.git 【算法介绍】 PaddleOCR是一个基于PaddlePaddle框架的开源光学字符识别&#xff08;OCR&#xff09;工具库&#xff0c;由百度公司开发。它提供了一套完整的OCR解决方案&#xff0c;包括文字检测、文字识别以…

使用 Apache PDFBox 操作PDF文件

简介 Apache PDFBox库是一个开源的Java工具&#xff0c;专门用于处理PDF文档。它允许用户创建全新的PDF文件&#xff0c;编辑现有的PDF文档&#xff0c;以及从PDF文件中提取内容。此外&#xff0c;Apache PDFBox还提供了一些命令行实用工具。 Apache PDFBox提供了创建、渲染、…

linux环境安装docker

一、Docker是什么? 当我们开发一个应用程序时&#xff0c;通常需要配置和安装各种软件、库和依赖项。而这些环境配置可能会因为不同的操作系统或版本而存在差异&#xff0c;导致应用在不同环境中运行出现问题。 Docker就像是一个集装箱&#xff0c;可以将应用程序及其所有依…

Java EE 博客系统(Servlet版)

文章目录 1. 基本情况2. 准备工作3. 博客列表页4. 博客详情页5. 实现登录6. 强制要求登录7. 显示用户信息8. 退出登录9. 发布博客10. 如果程序出现问题怎么办&#xff1f; 1. 基本情况 这里的博客系统主要是四个界面 博客列表页 显示出当前网站上都有哪些博客博客详情页 点击…

浅析ARMv8体系结构:A64指令集

文章目录 A64指令编码格式加载与存储指令寻址模式变基模式前变基模式后变基模式 PC相对地址模式 伪指令加载与存储指令的变种不同位宽的加载与存储指令多字节内存加载和存储指令基地址偏移量模式前变基模式后变基模式 跳转指令返回指令比较并跳转指令 其它指令内存独占访问指令…

面试题:MySQL误删表数据,如何快速恢复丢失的数据?

相信后端研发的同学在开发过程经常会遇到产品临时修改线上数据的需求&#xff0c;如果手法很稳那么很庆幸可以很快完成任务&#xff0c;很不幸某一天突然手一抖把表里的数据修改错误或者误删了&#xff0c;这个时候你会发现各种问题反馈接踵而来。 如果身边有BDA或者有这方面经…

Kubernetes WebHook 入门 -- 入门案例: apiserver 接入 github

博客原文 文章目录 k8s 集群配置介绍Admission WebhookWebHook 入门实践: github 认证接入web 服务器Dockerfile 镜像制作amd64x86_64构造镜像检验镜像 Makefilewebhook 接入 apiserverwebhook.yamlapiserver 挂载 webconfig在 github 中创建认证 token将 token 添加到 kubecon…

AI绘画:Midjournety的使用体验

今天的时间少&#xff0c;没有给大家做一些教程&#xff0c;就单纯分享使用体验&#xff0c;还不错&#xff0c;体验感很好。 后需如果有需要&#xff0c;我可以出一些教程类的视频。 下面是一组复刻fated的saber的一组提示词&#xff0c;效果相当不错。我后续会分享一些学习经…

ai电话呼叫系统的功能有哪些,能帮到我们什么?呼叫系统

人工智能产品的研发&#xff0c;是为了帮助企业更好的生存&#xff0c;更好的利润放大&#xff0c;而不是用于不正规的工作&#xff0c;现在的电话呼叫中心软件让企业员工从简单重复的工作中得以解放&#xff0c;那电话呼叫系统的强大功能有哪些&#xff1f; 知识自学习&#x…

目标检测-One Stage-YOLOx

文章目录 前言一、YOLOx的网络结构和流程1.YOLOx的不同版本2.Yolox-Darknet53YOLOv3 baselineYolox-Darknet53 3.Yolox-s/Yolox-m/Yolox-l/Yolox-x4.Yolox-Nano/Yolox-Tiny 二、YOLOx的创新点总结 前言 根据前文CenterNet、YOLOv4等可以看出学界和工业界都在积极探索使用各种t…

【Proteus仿真】【Arduino单片机】汽车车窗除霜系统设计

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真Arduino单片机控制器&#xff0c;使用LCD1602显示模块、光线传感器、DS18B20温度传感器、PCF8691 ADC模块、继电器加热模块等。 主要功能&#xff1a; 系统运行后&#xff0c;LCD…

Linux系统与windows系统设置定时任务的具体操作方法,如数据库自动备份等

设置定时备份 要设置数据库定时备份&#xff0c;你可以使用操作系统的定时任务功能来自动执行 backup.sh 脚本(此脚本可关注文末公众号回复04获取)。不同的操作系统有不同的方法来设置定时任务&#xff0c;但一般来说&#xff0c;你可以按照以下步骤进行操作&#xff1a; 打开…

python_selenium零基础爬虫学习案例_知网文献信息

案例最终效果说明&#xff1a; 去做这个案例的话是因为看到那个博主的分享&#xff0c;最后通过努力&#xff0c;我基本实现了进行主题、关键词、更新时间的三个筛选条件去获取数据&#xff0c;并且遍历数据将其导出到一个CSV文件中&#xff0c;代码是很简单的&#xff0c;没有…

vue computed计算不到数组或者对象的变化

form: {...childQuestionItems:[...{...score: 6}] } ... computed: {totalScore(){return this.form.childQuestionItems.reduce((sum,e)> sum Number(e.score || 0), 0)} } 想要computed 监听计算form.childQuestionItems改变后所有score的和 但是 computed并不监听。…

.NET Framework 与 .NET Core 与 .NET Standard 之间的差异

介绍 在本文中&#xff0c;我们将探讨 .NET Framework、.NET Core 和 .NET Standard 之间的差异。 .NET Framework 与 .NET Core .NET框架.NET核心 历史 .NET Framework 是 .NET 的第一个实现。 .NET Core 是 .NET 的最新实现。 开源 .NET Framework 的某些组件是开源的。 .N…

程序员该怎样爱护眼镜

当程序员是非常费眼睛的&#xff0c;一天中我们长期盯着电脑&#xff0c;眼镜会感到酸痛&#xff0c;所以我们大家要学会放松眼镜&#xff0c;下面是一些方法&#xff0c;大家来跟着动起来吧&#xff01; 1.修改编程软件字体大小 我们可以根据个人喜好将字体大小调成自己觉得…

Linux和windows进程同步与线程同步那些事儿(二): windows线程同步详解示例

《Linux和windows进程同步与线程同步那些事儿&#xff08;一&#xff09;》 一、线程同步 1.1 windows下线程同步 在Windows中&#xff0c;线程同步可以通过多种机制来实现&#xff0c;其中最常见的包括互斥量&#xff08;mutex&#xff09;、事件&#xff08;event&#xf…

【python可视化大屏】使用python实现可拖拽数据可视化大屏

介绍&#xff1a; 我在前几期分享了关于爬取weibo评论的爬虫&#xff0c;同时也分享了如何去进行数据可视化的操作。但是之前的可视化都是单独的&#xff0c;没有办法在一个界面上展示的。这样一来呢&#xff0c;大家在看的时候其实是很不方便的&#xff0c;就是没有办法一目了…

vue项目完整搭建与启动

vue项目完整搭建与启动 一&#xff0c;安装node环境二&#xff0c;安装vue脚手架&#xff08;vue-cli&#xff09;1.cnpm(淘宝镜像安装&#xff09;2.npm安装3.yarn安装 三&#xff0c;创建vue项目四&#xff0c;cmd切换目录方式1方式2 一&#xff0c;安装node环境 1.下载地址…