Back to packageRELEASE DETAILS

1.0.8

npm

3dily

3DILY

Published5 Jul 2022

Direct dependencies0

Transitive dependenciesNot calculated

README

Current package documentation

What is 3dily?

3dily is a library for the use of 3dily.com customers, with which you can display 3D models and 360 images on your site.

Installing

In the examples below, the Threedily object comes either from:

UMD

Threedily will be registered as a global variable:

<link href="./dist/3dily.css" rel="stylesheet" type="text/css">
<script src="./dist/3dily.min.js"></script>

ESM Module

<link href="./dist/3dily.css" rel="stylesheet" type="text/css">
<script type="module">
  import { Threedily } from "./dist/3dily.esm.min.js";
</script>

NPM

import { Threedily } from '3dily'
import '3dily/style.css'

Usage

<div id="3dily-viewer"></div>
<script>
    const opts = {
        containerId: '3dily-viewer',
        panelId: '6314455ed74d211b23946bbd',
        productCode: 'kamran',
    }
    const threedily = Threedily(opts)
</script>

React

App.js

import { useEffect, useRef } from "react";
import { Threedily } from "3dily";
import "3dily/style.css";

const App = () => {
  const threedily = useRef();

  useEffect(() => {
    threedily.current = Threedily({
      panelId: "6314455ed74d211b23946bbd",
      productCode: "kamran",
      containerId: "3dily-viewer",
    });
    return () => threedily.current?.remove();
  }, []);

  return (
    <div id="3dily-viewer" style={{ width: "500px", height: "500px" }}></div>
  );
};

export default App;

Options

Name	Description	Default Value
containerId (required)	The container element that we render threedily tool on this element	_
panelId (required)	The panel id that you can access thier product. Steps to get panelId: Log in to your panel > Profile > API key	_
productCode (required)	Code of the product	_
mode	which feature of threedily do you want to use for your product ? 360 or model	auto
shadow	shadow use for adding shadow on the printed product	false
variants	You specify the default variants	_
background	the background of product that want to show	#FFFFFF
autoAR	automaticly in mobile must go to ar workspace	false
arUrl	the url address of ar that we want to open	Current page

Methods

Name	Parameter	Description
changeVariants	({ layer: variant })	You can change the variants using this method. The input parameter must be an object of layer code and variant code, for example: { leg: 'blue', feet: 'brown', ... }
changeBackground	(color)	The color value can be a string of hex, hsl, rgb and color name (color is required)
toggleShadow	(value)	The parameter is optional, if no value is given, it will be false if it is true and vice versa
getData	()	With this method, you can get scene data
remove	()	You can delete the scene with this method
on	(eventName, cb)	With this method, you can add a callback to the desired event
off	(eventName, cb)	With this method, you can remove a callback from the desired event

Events

name	Arguments	Description
change-frame	(frame)	Event will fired on active frame change

Demos

Simple

React

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 0

Native requirements

0 direct targetsNot calculated transitive count

No declared dependencies in this collected response

Declarations describe requirements; they are not a resolved dependency graph.

Distribution files

1 collected

Distribution 1

Source distribution

Source file

Checksums from source

{
  "integrity": "sha512-5UoNuIZ25th4E+BeRX/vgonLXV2/LMRGchGKD75kOhP76aQtRtDMJO1HTaIqVVvB5ipU6VGts7jhPTGEcBkftQ==",
  "shasum": "fe837ea68ac149784023fd40751c3a20bef5c382",
  "tarball": "https://registry.npmjs.org/3dily/-/3dily-1.0.8.tgz",
  "fileCount": 37,
  "unpackedSize": 127565,
  "signatures": [
    {
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
      "sig": "MEQCIDiXqjP3KPVTspenxRUeatL33pndbXNNi/AQj8BGY2zjAiBizAaulTDSu2ghDF3PjEnbtTnYPGO097y2I84CSCPRBA=="
    }
  ],
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJixDKMACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmreJA/+MOVSfRtkldj6pSi3wXZQWncL4PtE9RdBtr3Pfu/p1lL5K+i2\r\n/s0OD2EWHaFL8flF7GjkXrgw2hl3DfgP3l2H8Ju5Y6dZPVxLfEtGapZKaBt+\r\nJMXcAj+fdV2oJIeRSMqQGW1BODBA9V1UnWNeoJRK2SupHXR0PMgyE/CIf3Z4\r\nf3LmlLEaeIaf9G8MlsNgYLKJGSvvnclhxatNnLjwbMtKmGWGBh53XGBv8G/X\r\nNlkxyJmVoe/ThZ3ZpEuU2geyHdQxx1XRLG/D+rpUlgNBMwqeqQdV6+FmoCQA\r\nOFKGumJVDIMWej5iDhyIyBhZ3t/NOlc74gWl0Wjr9qbGTDhr0yuMxu3nvkoJ\r\nuk/PhEFvD1F9RVsjFmxIHdUnrUcBqBoGoNr8kFAxz3bxQW4yB3uVaDHKBxWu\r\nno1QNOvekKKChkjbm0s/PepTS8+ilpxyiJ/tzYh7rzzZ/LcYpZLm1sc2aJMO\r\nT2DHI4YrkvLGwnfAhOXNXkQmRFvQF8xUc+eVy8wKpJQdNids1Bak3ARxCbTZ\r\nGJli1gVxHZFeSre/4TLzoIc2LPeoYCXubDfKK1D/qduGGW1PAwhvr48cn4EL\r\nv+6BonIthU+75IuUnbAqT3l4k8z7EWCzpL1KdRHFOP7DGcSKDZAEFiWMIUqr\r\nDyICZkjKGNgZBaJrZJ5pT0mQsGpCXAnklKw=\r\n=xxry\r\n-----END PGP SIGNATURE-----\r\n"
}

Repository

PENDING

3dily/3dily

Shared repository data · GitHub

License detected in repository: Not collected

Metadata history

Meaningful changes

Current collected state Current

Observed since 20 Oct, 19:39 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:7c2d4b5db4e353a280f735a1272dc4e4aec2fcc1247359346e50495843374fb8

Other collected versions

1.1.3-beta19 Sept 1.1.214 Sept 1.1.114 Aug 1.1.024 Jul 1.0.924 Jul 1.0.728 Jun View all collected versions →