Skip to content

Commit

Permalink
Continue fixing docs
Browse files Browse the repository at this point in the history
  • Loading branch information
@boytchev
boytchev committed Jul 25, 2024
1 parent 02e7c92 commit dccfedf
Show file tree
Hide file tree
Showing 3 changed files with 53 additions and 56 deletions.
46 changes: 20 additions & 26 deletions docs/userguide-bg.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
- **[Части на тялото](#части-на-тялото)** (<small>[Централни части на тяло](#централни-части-на-тяло) | [Горни крайници](#горни-крайници) | [Долни крайници](#долни-крайници)</small>)
- **[Поза на тялото](#поза-на-тялото)** (<small>[Статична поза](#статична-поза) | [Динамична поза](#динамична-поза) | [Работа с пози](#работа-с-пози)</small>)
- **[Други функционалности](#други-функционалности)** (<small>[Собствени цветове](#собствени-цветове) | [Скриване на части от тялото](#скриване-на-части-от-тялото) | [Собствени части на тяло](#собствени-части-на-тяло) | [Глобална позиция](#глобална-позиция)</small>)
- **[Общност](#общност)**



Expand Down Expand Up @@ -490,9 +489,9 @@ figure.joint.hide();
въртят и това се отразява на частите на тялото,
прикрепени към тях. Следващият пример скрива двете
ръце и двата крака, но те все още същестуват и се
използват от лактите и коленете ([пример на живо](https://boytchev.github.io/mannequin.js/examples/example-hide.html)):
използват от лактите и коленете ([пример на живо](example-hide.html)):

[<img src="examples/snapshots/example-hide.jpg">](https://boytchev.github.io/mannequin.js/examples/example-hide.html)
[<img src="snapshots/example-hide.jpg">](example-hide.html)

``` javascript
man.l_leg.hide();
Expand All @@ -510,10 +509,10 @@ man.r_arm.hide();
тялото трябва да е еднакво по всички оси, в противен случай
позате трябва да бъде ръчно коригирана ([пример на живо](https://boytchev.github.io/mannequin.js/examples/example-custom-sizes.html)):

[<img src="examples/snapshots/example-custom-sizes.jpg">](https://boytchev.github.io/mannequin.js/examples/example-custom-sizes.html)
[<img src="snapshots/example-custom-sizes.jpg">](example-custom-sizes.html)

``` javascript
man = new Male();
var man = new Male();

man.head.scale.set(3,3,3);

Expand All @@ -536,15 +535,15 @@ figure.joint.attach(object);
Обектите могат да бъдат прикрепени към скрити части
на тялото, но те не се скриват автоматично. Този
подход се използва за замяна на част от тялото с
изцяло собствен потребителски обект ([пример на живо](https://boytchev.github.io/mannequin.js/examples/example-custom-body-parts.html)):
изцяло собствен потребителски обект ([пример на живо](example-custom-body-parts.html)):

[<img src="examples/snapshots/example-custom-body-parts.jpg">](https://boytchev.github.io/mannequin.js/examples/example-custom-body-parts.html)
[<img src="snapshots/example-custom-body-parts.jpg">](example-custom-body-parts.html)

``` javascript
man = new Male();
var man = new Male();

// добавяне на гривни
bracelet = new THREE.Mesh(
var bracelet = new THREE.Mesh(
new THREE.CylinderGeometry(3,3,1,16),
new THREE.MeshPhongMaterial({color:'crimson',shininess:200})
);
Expand All @@ -559,9 +558,9 @@ man.r_elbow.attach(bracelet);
// замяна на крака с други обекти
man.r_leg.hide();

material = new THREE.MeshPhongMaterial({color:'crimson',shininess:200});
var material = new THREE.MeshPhongMaterial({color:'crimson',shininess:200});

obj = new THREE.Mesh(new THREE.CylinderGeometry(3,2,3,32), material);
var obj = new THREE.Mesh(new THREE.CylinderGeometry(3,2,3,32), material);
obj.castShadow = true;
obj.position.y = 2;
man.r_leg.attach(obj);
Expand All @@ -577,9 +576,9 @@ man.r_leg.attach(obj);
от тялото.

Следващият пример създава въже, преминаващо през 5 точки
от частите на тялото на фигура ([пример на живо](https://boytchev.github.io/mannequin.js/examples/example-point.html)):
от частите на тялото на фигура ([пример на живо](example-point.html)):

[<img src="examples/snapshots/example-point.jpg">](https://boytchev.github.io/mannequin.js/examples/example-point.html)
[<img src="snapshots/example-point.jpg">](example-point.html)

``` javascript
setLoopVertex( 0, man.r_fingers.tips.point(0,1,0) );
Expand All @@ -599,13 +598,13 @@ setLoopVertex( 4, man.r_ankle.point(6,2,0) );
обувка (т.е. `man.r_ankle` и `man.l_ankle`). Контактните точки
на лявата обувка са показани като червени точки. Минималното
вертикално положение на осемте контактни точки се използва за
регулиране на вертикалното положение на фигурата ([пример на живо](https://boytchev.github.io/mannequin.js/examples/example-touch-ground.html)):
регулиране на вертикалното положение на фигурата ([пример на живо](example-touch-ground.html)):

[<img src="examples/snapshots/example-touch-ground.jpg">](https://boytchev.github.io/mannequin.js/examples/example-touch-ground.html)
[<img src="snapshots/example-touch-ground.jpg">](example-touch-ground.html)

``` javascript
// изчисляване на минималното вертикално отклонение на контактните точки
bottom = Math.min(
var bottom = Math.min(
man.l_ankle.point(6,2,0).y,
man.l_ankle.point(-2,2.5,0).y,
man.l_ankle.point(2,2.5,2).y,
Expand All @@ -621,13 +620,8 @@ man.position.y += (-29.5-bottom);
```


# Общност

Списък от сайтове, които използват mannequin.js:

* [SetPose.com](https://setpose.com/) &ndash; безплатен интерактивен референтен 3D модел за рисуване на фигури, динамични пози и други онлайн модели

---

Януари, 2023

<div class="footnote">
<a href="../">Home</a> &middot;
<a href="https://github.com/boytchev/mannequin.js">GitHub</a>
</div>
50 changes: 21 additions & 29 deletions docs/userguide.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
- **[Body parts](#body-parts)** (<small>[Central body parts](#central-body-parts) | [Upper limbs](#upper-limbs) | [Lower limbs](#lower-limbs)</small>)
- **[Body posture](#body-posture)** (<small>[Static posture](#static-posture) | [Dynamic posture](#dynamic-posture) | [Working with postures](#working-with-postures)</small>)
- **[Other functions](#other-functions)** (<small>[Custom colors](#custom-colors) | [Hiding body parts](#hiding-body-parts) | [Custom body parts](#custom-body-parts) | [Global position](#global-position)</small>)
- **[Community](#community)**



Expand Down Expand Up @@ -404,9 +403,9 @@ Each body part could be hidden. This does not remove the body part and its graph
figure.joint.hide();
```

where *joint* is the name of the body part to hide. Hidden body parts can still be rotated and this affects the other body parts attached to them. The following example hides both arms and both legs, but they are still preserved internally and used by elbows and knees ([live example](https://boytchev.github.io/mannequin.js/examples/example-hide.html)):
where *joint* is the name of the body part to hide. Hidden body parts can still be rotated and this affects the other body parts attached to them. The following example hides both arms and both legs, but they are still preserved internally and used by elbows and knees ([live example](example-hide.html)):

[<img src="examples/snapshots/example-hide.jpg">](https://boytchev.github.io/mannequin.js/examples/example-hide.html)
[<img src="snapshots/example-hide.jpg">](example-hide.html)

``` javascript
man.l_leg.hide();
Expand All @@ -418,12 +417,12 @@ man.r_arm.hide();

### Custom body parts

Body parts are descendants of [`THREE.Object3D`](https://threejs.org/docs/#api/en/core/Object3D) and supports its properties and methods. However, due to the skeletal dependency and joint attachment, scaling of a body part should be congruent along all axes, otherwise positions need to be adjusted ([live example](https://boytchev.github.io/mannequin.js/examples/example-custom-sizes.html)):
Body parts are descendants of [`THREE.Object3D`](https://threejs.org/docs/#api/en/core/Object3D) and supports its properties and methods. However, due to the skeletal dependency and joint attachment, scaling of a body part should be congruent along all axes, otherwise positions need to be adjusted ([live example](example-custom-sizes.html)):

[<img src="examples/snapshots/example-custom-sizes.jpg">](https://boytchev.github.io/mannequin.js/examples/example-custom-sizes.html)
[<img src="snapshots/example-custom-sizes.jpg">](example-custom-sizes.html)

``` javascript
man = new Male();
var man = new Male();

man.head.scale.set(3,3,3);

Expand All @@ -440,15 +439,15 @@ Any custom `THREE.Object3D` could be attached to a body part. The attached objec
figure.joint.attach(object);
```

Objects can be attached to hidden body parts, but they are not automatically hidden. This approach is used to replace a body part with entirely custom user object ([live example](https://boytchev.github.io/mannequin.js/examples/example-custom-body-parts.html)):
Objects can be attached to hidden body parts, but they are not automatically hidden. This approach is used to replace a body part with entirely custom user object ([live example](example-custom-body-parts.html)):

[<img src="examples/snapshots/example-custom-body-parts.jpg">](https://boytchev.github.io/mannequin.js/examples/example-custom-body-parts.html)
[<img src="snapshots/example-custom-body-parts.jpg">](example-custom-body-parts.html)

``` javascript
man = new Male();
var man = new Male();

// adding bracelets
bracelet = new THREE.Mesh(
var bracelet = new THREE.Mesh(
new THREE.CylinderGeometry(3,3,1,16),
new THREE.MeshPhongMaterial({color:'crimson',shininess:200})
);
Expand All @@ -463,9 +462,9 @@ man.r_elbow.attach(bracelet);
// replacing the leg with other objects
man.r_leg.hide();

material = new THREE.MeshPhongMaterial({color:'crimson',shininess:200});
var material = new THREE.MeshPhongMaterial({color:'crimson',shininess:200});

obj = new THREE.Mesh(new THREE.CylinderGeometry(3,2,3,32), material);
var obj = new THREE.Mesh(new THREE.CylinderGeometry(3,2,3,32), material);
obj.castShadow = true;
obj.position.y = 2;
man.r_leg.attach(obj);
Expand All @@ -475,9 +474,9 @@ man.r_leg.attach(obj);

Not all interaction between figures and other objects can be implemented by attaching. Mannequin.js provides method `point(x,y,z)` for each body part. This method implements [forward kinematics](https://en.wikipedia.org/wiki/Forward_kinematics) and calculates the global coordinates of the point *(x,y,z)*, defined in the local coordinate system of the body part.

The following example creates a thread going through 5 points relative to body parts of a figure ([live example](https://boytchev.github.io/mannequin.js/examples/example-point.html)):
The following example creates a thread going through 5 points relative to body parts of a figure ([live example](example-point.html)):

[<img src="examples/snapshots/example-point.jpg">](https://boytchev.github.io/mannequin.js/examples/example-point.html)
[<img src="snapshots/example-point.jpg">](example-point.html)

``` javascript
setLoopVertex( 0, man.r_fingers.tips.point(0,1,0) );
Expand All @@ -489,13 +488,13 @@ setLoopVertex( 4, man.r_ankle.point(6,2,0) );

Global positions could be used to ground figures &ndash; this is to put them down on the ground. However, mannequin.js does not contain any collision functionality, thus the user should pick collision points and use their global position.

The following example uses four contact points on each shoe (i.e. `man.r_ankle` and `man.l_ankle`). The contacts points of the left shoe are shown as red dots. The minimal vertical position of the eight contact points is used to adjust the vertical position of the figure ([live example](https://boytchev.github.io/mannequin.js/examples/example-touch-ground.html)):
The following example uses four contact points on each shoe (i.e. `man.r_ankle` and `man.l_ankle`). The contacts points of the left shoe are shown as red dots. The minimal vertical position of the eight contact points is used to adjust the vertical position of the figure ([live example](example-touch-ground.html)):

[<img src="examples/snapshots/example-touch-ground.jpg">](https://boytchev.github.io/mannequin.js/examples/example-touch-ground.html)
[<img src="snapshots/example-touch-ground.jpg">](example-touch-ground.html)

``` javascript
// get minimal vertical position of contact points
bottom = Math.min(
var bottom = Math.min(
man.l_ankle.point(6,2,0).y,
man.l_ankle.point(-2,2.5,0).y,
man.l_ankle.point(2,2.5,2).y,
Expand All @@ -509,17 +508,10 @@ bottom = Math.min(

man.position.y += (-29.5-bottom);
```

# Community

List of sites that use mannequin.js:

* [SetPose.com](https://setpose.com/) &ndash; free interactive 3D model reference for drawing figures, dynamic poses, and more online drawing mannequin
* [ControlnNet 3D Pose](https://huggingface.co/spaces/diffusers/controlnet-3d-pose) &ndash; pose in 3D and render with ControlNet (SD-1.5)


---

April, 2023

<div class="footnote">
<a href="../">Home</a> &middot;
<a href="https://github.com/boytchev/mannequin.js">GitHub</a>
</div>
13 changes: 12 additions & 1 deletion index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,19 @@ at [Sofia University](https://www.uni-sofia.bg/index.php/eng).
[<img src="https://boytchev.github.io/mannequin.js/docs/snapshots/example-posture-editor.jpg">](https://boytchev.github.io/mannequin.js/src/editor/posture-editor.html)


### Community

List of sites that use mannequin.js:

* [SetPose.com](https://setpose.com/) &ndash; free interactive 3D model reference for drawing figures, dynamic poses, and more online drawing mannequin
* [ControlnNet 3D Pose](https://huggingface.co/spaces/diffusers/controlnet-3d-pose) &ndash; pose in 3D and render with ControlNet (SD-1.5)



<div class="footnote">
<a href="docs/cookies.html">Cookies</a> &middot;
<a href="docs/licence.html">Licence</a> &middot;
<a href="https://github.com/boytchev/mannequin.js">GitHub</a>
</div>
</div>


0 comments on commit dccfedf

Please sign in to comment.