Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@google/model-viewer-effects
Advanced tools
Readme
<model-viewer-effects>
<model-viewer-effects>
is a web component library addon for <model-viewer>
that makes adding post-processing
effects to your models easy to do, on as many browsers and devices as possible.
<model-viewer-effects>
strives to give you great defaults for rendering quality and
performance.
Using effects is as simple as adding the <effect-composer>
inside your <model-viewer>
, and placing any effects inside the composer component.
<model-viewer src="...">
<effect-composer>
<bloom-effect></bloom-effect>
</effect-composer>
</model-viewer>
<model-viewer-effects>
uses the postprocessing library under the hood, for its superior performance and support.
In addition to the built-in effects wrapped by this library, you can add any custom effects/passes that follow the postprocessing spec.
The effects are not supported in the <model-viewer>
XR modes, which will render as usual.
The <model-viewer-effects>
library can be installed from NPM:
npm install three @google/model-viewer @google/model-viewer-effects
<model-viewer-effects>
and <model-viewer>
share a Three.js dependency. In order to avoid version conflicts, you should bring Three through an import-map
:
<!-- ES-Shims for older browser compatibility -->
<script async src="https://ga.jspm.io/npm:es-module-shims@1.7.1/dist/es-module-shims.js"></script>
<!-- Import Three.js using an import-map -->
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@^0.163.0/build/three.module.min.js"
}
}
</script>
You should then bring the module
version of <model-viewer>
, along with <model-viewer-effects>
from your favourite CDN, such as jsDelivr:
<script type="module" src=" https://cdn.jsdelivr.net/npm/@google/model-viewer/dist/model-viewer-module.min.js "></script>
<script type="module" src=" https://cdn.jsdelivr.net/npm/@google/model-viewer-effects/dist/model-viewer-effects.min.js "></script>
<model-viewer-effects>
is supported on the last 2 major versions of all evergreen
desktop and mobile browsers, and on all platforms (Android, IOS, MacOS, Windows, Linux).
Chrome | Firefox | Safari | Edge | |
---|---|---|---|---|
Desktop | ✅ | ✅ | ✅ | ✅ |
Mobile | ✅ | ✅ | ✅ | ✅ |
<model-viewer-effects>
builds upon standard web platform APIs so that the performance,
capabilities and compatibility of the library get better as the web evolves.
To get started, follow the instructions in the main README.md file.
The following commands are available when developing <model-viewer-effects>
:
Command | Description |
---|---|
npm run build | Builds all <model-viewer-effects> distributable files |
npm run build:dev | Builds a subset of distributable files (faster than npm run build ) |
npm run test | Run <model-viewer-effects> unit tests |
npm run clean | Deletes all build artifacts |
npm run dev | Starts tsc and rollup in "watch" mode, causing artifacts to automatically rebuild upon incremental changes |
Rocket Ship by Daniel Melchior CC-BY via Poly Pizza
FAQs
Easily add and combine post-processing effects with <model-viewer>!
The npm package @google/model-viewer-effects receives a total of 213 weekly downloads. As such, @google/model-viewer-effects popularity was classified as not popular.
We found that @google/model-viewer-effects demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.