תחוב איפשהו ב הערות גרסה של Safari Technology Preview 161 היא שורה תמימה לכאורה לגבי תמיכה ברכיב ותכונה HTML חדשים:
בכל פעם שאני רואה אזכור של אלמנט כלשהו שאני לא מזהה, המוח שלי הולך ישר אליו הא! חדש לי, אבל כנראה חדשות ישנות לכל השאר. זה יציבה גרועה, אני יודע, כפי שזה יכול להיות באותה קלות:
- הממ, נראה כמו איזה ניסוי קנייני.
- וואו, דבר חדש באמת!
האמת היא שזה בערך שלושתם.
זה מושג מתפתח
כמו ב, הדבר הראשון שנשמע קצת רשמי שמצאתי בו <model>
לא היה במפרט W3C אלא ב המאגר של WebKit למסבירים. כל מה שכתוב ב-README הוא פתק ענק מ-2021 ש-"The <model>
האלמנט עבר ל-Immersive Web CG." עמדתי לקפוץ אבל העין שלי צדה את זה HistoryAndEvolution.md
קובץ שיש לו סקירה יפה של ההקשר המוקדם על <model>
מוּשָׂג:
השמיים
<model>
אלמנט נולד מתוך רצון לעשות את הצעד הבא ולשפר את חווית האינטגרציה של Safari עם iOS AR מבט מהיר תכונה.
הייתי צריך להסתכל על דף הפתיחה של אפל עבור AR Quick Look. אתה מכיר את התכונה החדשה שיש לחנויות מסוימות שבהן אתה יכול להעביר עיבוד תלת מימדי של מוצר בבית שלך באמצעות מצלמת הטלפון שלך? זה מסוג הדברים שאנחנו מדברים עליהם, ו אפל מקשרת מקרה בוחן נחמד ממוזיאון המטרופוליטן לאמנות.
כפי שאני מבין את זה מההקשר המצומצם הזה:
- זרוק א
<model>
רכיב במסמך. - הוסף קובץ מקור חיצוני, למשל
<model src="assets/example.usdz">
.
ההצעה המקורית היא מקבוצת ועדת האינטרנט המטמעת
זה הצוות מראה הופכים מציאות מדומה (VR) ומציאות רבודה (AR) לחלק מהאינטרנט. אפל קישרה את המאגר שלהם, אז עשיתי את הקפיצה והלכתי ישר למסביר. זה לא המפרט או משהו, אלא ההצעה המקורית. הגדרה הרבה יותר טובה של האלמנט!
HTML מאפשר הצגת סוגי מדיה רבים באמצעות אלמנטים כגון
<img>
,<picture>
, או<video>
, אך הוא אינו מספק דרך הצהרתית להצגת תוכן תלת-ממדי ישירות. הטמעת תוכן תלת-ממדי בתוך דף מסורבלת יחסית ומסתמכת על סקריפט של<canvas>
אֵלֵמֶנט. אנו מאמינים שהגיע הזמן להעמיד מודלים תלת-ממדיים על בסיס שווה לסוגי מדיה אחרים, שכבר נתמכים.[...]
ה- HTML
<model>
אלמנט מטרתו לאפשר לאתר להטמיע מודלים תלת מימדיים אינטראקטיביים בצורה נוחה כמו כל מדיה ויזואלית אחרת. מודלים צפויים להיווצר על ידי כלי כתיבה תלת מימדיים או ליצור באופן דינמי, אך שימשו כמשאב עצמאי על ידי השרת.
הדוגמה הבסיסית משלבת את זה יחד. זה באמת מרגיש כמו ה <video>
or <picture>
אלמנטים:
<model style="width: 400px; height: 300px"> <source src="assets/example.usdz" type="model/vnd.usdz+zip"> <source src="assets/example.glb" type="model/gltf-binary">
</model>
.usdz
? .glb
? לא מסוג הקבצים שחוצים בדרך כלל את השולחן שלי. אני מניח שאצטרך לרענן את אלה ואת כל סוגי הקבצים האחרים <model>
עשוי לתמוך. שוב, כל זה הוא רק ההצעה המקורית.
טיוטת ההצעה עדיין לא נמחקה לגמרי
אבל זה כן לספק מתאר יפה לאן דברים יכולים ללכת:
- הוספת דגם למסמך
- הפעלת אינטראקטיביות
- תמיכה במספר פורמטים
- מתן תוכן חלופי
- הופך אותו לנגיש
יש הרבה מה להבין. רוב מה שיש הם נושאים מתועדים שצריך לטפל בהם. עם זאת, זה שופך יותר אור <model>
כמו תכונות מוצעות שגורמות לו להרגיש אחיד יותר כמו <video>
כמו autoplay
, controls
, loop
, muted
, poster
, וכו '
זה חוזר עוד יותר אחורה
האזכור המוקדם ביותר של דוגמנות תלת מימד שמצאתי היה הפוסט של קית' קלארק משנת 2018 שבו הוא יוצר אב טיפוס של אלמנט מותאם אישית שנקרא <x-model>
. הוא מתאר את זה כ"מציין מיקום המספק גישה ל-DOM ול-CSSOM" שבו הטעינה והעיבוד מתבצעים ב three.js.
הרעיון של קית' מלווה את <model-viewer>
רכיב ששיתף ג'ו מדלי ב-2020 (וגם לאחר מכן עדכון אליו). יש אפילו א דף הבית עבורו וזה כיף לגרור את ניל ארמסטרונג בחלל.
אולי זה רק ניסוי?
כלומר, מפרט הטיוטה לא הושלם. נראה שאפל מוכנה לשחק בכדור הודות להכרזה של Safari TP 161. זה הגיוני לגמרי בהתחשב כמה שורית אפל ב-AR כשלם. (אפל משקפייםמישהו?)
נראה שלגוגל יש רגל בדלת, אם כי בצד של רכיבי האינטרנט של הדברים. קל לראות כיצד עשוי להיות ניגוד אינטרסים בין מה שאפל וגוגל רוצות מ-AR באינטרנט.
כל אלה הם רק ההערות שלי מהניסיון לגרש הכל. חייב להיות בו הרבה יותר ניואנסים מהמעט שאני יודע עליו עד כה. אני בטוח שמישהו חכם יותר יכול לקשור קשת מסודרת יותר <model>
בהערות. 😉
ובעוד אנחנו מדברים על תצוגה מקדימה של טכנולוגיית Safari, 162 שוחרר רק לפני כמה ימים וזה מאפשר קינון CSS ו תחביר צבע יחסי של CSS.
- הפצת תוכן ויחסי ציבור מופעל על ידי SEO. קבל הגברה היום.
- Platoblockchain. Web3 Metaverse Intelligence. ידע מוגבר. גישה כאן.
- מקור: https://css-tricks.com/ar-vr-and-a-model-for-3d-in-html/
- 1
- 11
- 2018
- 2021
- 3d
- טיוח תלת ממדי
- 7
- 9
- 98
- a
- אודות
- בנוגע לזה
- גישה
- פְּנִיָה
- מטרות
- תעשיות
- מאפשר
- כְּבָר
- ו
- הַכרָזָה
- כל אחד
- תפוח עץ
- AR
- ארמסטרונג
- סביב
- תכונות
- מוגבר
- מציאות מועשרת
- מציאות רבודה (ar)
- מחבר
- בחזרה
- כדור
- בסיסי
- תאמינו
- מוטב
- בֵּין
- נולד
- Bullish
- נקרא
- חדר
- מקרה
- מקרה מבחן
- נתפס
- צֶבַע
- הערות
- הוועדה
- באופן יחסי
- רְכִיב
- רכיבים
- מושג
- סכסוך
- תוכן
- הקשר
- יכול
- נוצר
- לַחֲצוֹת
- מנהג
- dev
- ישירות
- לְהַצִיג
- מסמך
- DOM
- לא
- דֶלֶת
- מטה
- טיוטה
- מוקדם
- בקלות
- אלמנטים
- מאפשר
- וכו '
- אֲפִילוּ
- כולם
- הכל
- מתפתח
- דוגמה
- צפוי
- ניסיון
- לְנַסוֹת
- חיצוני
- עין
- מאפיין
- תרשים
- שלח
- קבצים
- ראשון
- בעקבות
- כף רגל
- מצא
- החל מ-
- מ 2021
- כֵּיף
- נוצר
- ענק
- GitHub
- נתן
- Go
- Goes
- גובה
- עמוד הבית
- איך
- אולם
- HTML
- HTTPS
- חולה
- רעיון
- immersive
- לשפר
- in
- השתלבות
- אינטראקטיבי
- אינטרס
- בעיות
- IT
- JOE
- לקפוץ
- לדעת
- אוֹר
- מוגבל
- קו
- צמוד
- קישורים
- קְצָת
- טוען
- נראה
- הסתכלות
- נראה
- מגרש
- מקרומורים
- עשוי
- לעשות
- עושה
- דרך
- רב
- מדיה
- רק
- יכול
- אכפת לי
- מודל
- מודלים
- יותר
- רוב
- מספר
- מוזיאון
- צורך
- חדש
- חדשות
- הבא
- הערות
- ניואנס
- זקן
- מְקוֹרִי
- אחר
- שֶׁלוֹ
- חלק
- טלפון
- מציין מיקום
- אפלטון
- מודיעין אפלטון
- אפלטון נתונים
- לְשַׂחֵק
- עני
- תצוגה מקדימה
- כנראה
- המוצר
- הצעה
- מוּצָע
- מוּגָן
- טיפוס
- לספק
- מספק
- מושך
- גם
- מָהִיר
- מציאות
- להכיר
- לשחרר
- שוחרר
- טיוח
- משאב
- ספארי
- נראה
- תחושה
- משותף
- צד
- חכם יותר
- So
- עד כה
- כמה
- מישהו
- במידה מסוימת
- אי שם
- מָקוֹר
- מֶרחָב
- עצמאי
- שלב
- חנויות
- ישר
- לימוד
- לאחר מכן
- כזה
- תמיכה
- נתמך
- לקחת
- מדבר
- טכנולוגיה
- השמיים
- שֶׁלָהֶם
- דבר
- דברים
- שְׁלוֹשָׁה
- דרך
- עניבה
- זמן
- ל
- יַחַד
- כלים
- סה"כ
- נָכוֹן
- סוגים
- בדרך כלל
- להבין
- וירטואלי
- מציאות וירטואלית
- מדיה חזותית
- vr
- W3
- אינטרנט
- רכיבי רשת
- ערכת רשת
- אתר
- מה
- אשר
- בזמן
- מוכן
- בתוך
- אתה
- זפירנט