keyshot模型庫在材質(zhì)文件的話就放在安裝目錄的library\materialpreview文件夾里,要是整個的C4D工程的話可以直接使用。

網(wǎng)站建設(shè)哪家好,找創(chuàng)新互聯(lián)公司!專注于網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、重慶小程序開發(fā)、集團企業(yè)網(wǎng)站建設(shè)等服務(wù)項目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了潞州免費建站歡迎大家使用!
lib4d格式的文件是預(yù)置文件可以放在library\browser這個文件夾里,至于png素材可以直接使用在貼圖等上面的,放哪個文件夾都行。
以表盤玻璃為例來講述keyshot渲染器渲染玻璃材質(zhì)的參數(shù)和方法,在建模階段,我們需要把不同材質(zhì)分為不同圖層,這樣到時候添加玻璃材質(zhì)的時候比較快。
KeyShotVR:
KeyShot 3.3采用了一種還尚未申請專利的全新技術(shù),可在網(wǎng)頁上展示產(chǎn)品。KeyShotVRTM能夠?qū)a(chǎn)品以互動3D的形式展示出來,任何網(wǎng)頁瀏覽器只要安裝了HTML5就可以觀看到,這也包括移動設(shè)備,不需要再安裝任何特殊插件。
KeyShotVR是一個可選的擴展軟件,可以引進一個額外的渲染選項,它的設(shè)置能夠創(chuàng)建四種不同的VR類型,產(chǎn)生可移植在任何一個網(wǎng)頁的觸控3D體驗。
這么巧啊,我也在學(xué)html5。如果你不嫌我的代碼的話,可以看看我寫的時鐘。
!DOCTYPE?html
html
body
canvas?id="canvas"?width="500"?height="500"
您的瀏覽器不支持canvas標簽
/canvas
/body
script?type="text/javascript"
//讓時針和分針動起來
setInterval("timer()",?1000);
var?clock?=?document.getElementById("canvas");
var?cxt?=?clock.getContext("2d");
timer();
function?timer(){
cxt.clearRect(0,?0,?500,?500);
var?now?=?new?Date();
var?second?=?now.getSeconds();
var?minute?=?now.getMinutes();
var?hour?=?now.getHours();
hour?=?(hour??12)???hour-12?:?hour;
//表盤(藍色邊框)
cxt.lineWidth?=?10; //設(shè)置筆觸大小
cxt.strokeStyle?=?"blue"; //設(shè)置筆觸顏色
cxt.beginPath();
cxt.arc(250,?250,?200,?0,?360,?false); //設(shè)置外框的大小
cxt.closePath();
cxt.stroke();
//時刻度
for(var?i=0;?i12;?i++)
{
cxt.save();
//開始畫刻度
cxt.lineWidth?=?7; //矯正cxt的的刻度代銷和顏色
cxt.strokeStyle?=?"#000";
cxt.translate(250,?250); //設(shè)置異次元空間的0,0
//計算每次旋轉(zhuǎn)的弧度,角度*Math.PI/180
cxt.rotate(i*30*Math.PI/180);
//開始畫時針的線
cxt.beginPath();
cxt.moveTo(0,?-180);
cxt.lineTo(0,?-195);
cxt.closePath()
cxt.stroke();
cxt.restore();
}
//分刻度
for(var?i=0;?i60;?i++)
{
cxt.save();
//開始畫刻度
cxt.lineWidth?=?5; //矯正cxt的的刻度代銷和顏色
cxt.strokeStyle?=?"#000";
cxt.translate(250,?250); //設(shè)置異次元空間的0,0
//計算每次旋轉(zhuǎn)的弧度,角度*Math.PI/180
cxt.rotate(i*6*Math.PI/180);
//開始畫時針的線
cxt.beginPath();
cxt.moveTo(0,?-190);
cxt.lineTo(0,?-195);
cxt.closePath()
cxt.stroke();
cxt.restore();
}
//時針
cxt.save();
cxt.translate(250,250);
cxt.rotate((hour+minute/60)*30*Math.PI/180);
//設(shè)置時針風格
cxt.lineWidth?=?8;
cxt.strokeStyle?=?"#000";
cxt.beginPath();
cxt.moveTo(0,?-130); //起點為時針頂點位置
cxt.lineTo(0,?10); //超過圓心一點更美觀
cxt.closePath();
cxt.stroke();
cxt.restore();
//分針
cxt.save();
cxt.translate(250,250);
cxt.rotate(minute*6*Math.PI/180);
//設(shè)置分針風格
cxt.lineWidth?=?5;
cxt.strokeStyle?=?"#333";
cxt.beginPath();
cxt.moveTo(0,?-150); //起點為時針頂點位置
cxt.lineTo(0,?10); //超過圓心一點更美觀
cxt.closePath();
cxt.stroke();
cxt.restore();
//秒針
cxt.save();
//設(shè)置秒針風格
cxt.strokeStyle?=?"red";
cxt.lineWidth?=?3;
cxt.translate(250,?250);
cxt.rotate(second*6*Math.PI/180);
cxt.beginPath();
cxt.moveTo(0,?-175);
cxt.lineTo(0,?20);
cxt.closePath();
cxt.stroke();
//畫一個圓形,覆蓋圓心
cxt.beginPath();
cxt.arc(0,0,5,0,360,false);
cxt.fillStyle?=?"gray";
cxt.fill();
//設(shè)置筆觸樣式
cxt.stroke();
cxt.closePath();
//畫另一個圓形,添加到秒針的頭部
cxt.beginPath();
cxt.arc(0,-150,6,0,360,false);
cxt.fillStyle?=?"#fff";
cxt.fill();
//設(shè)置筆觸樣式
cxt.stroke();
cxt.closePath();
cxt.restore();
//增加小時數(shù)字刻度
cxt.lineWidth?=?1;
cxt.font?=?"20px?宋體";
//cxt.strokeStyle?=?"#369";
for(var?i=0;?i12;?i++)
{
//每次開啟一個異次元空間,寫下數(shù)字,旋轉(zhuǎn)30度即可
cxt.save();
cxt.translate(250,?250);
var?num?=?i?==?0???12?:?i;
cxt.rotate(i*30*Math.PI/180);
var?position_x?=?(num??9)???-10?:?-5;
cxt.strokeText(num,?position_x,?-165);
cxt.restore();
}
}
/script
/html
只要你不顧瀏覽器兼容性,這些東西都可以做出來,但是只有一個或者幾個瀏覽器可以顯示
以畫布的中心為原點,判斷手指在畫布中的坐標,算出角度,然后根據(jù)角度畫圓。如果你不是用在手機,還可以用html5的拖放效果來實現(xiàn)
代碼:
var clock=document.getElementById("clock");
var cxt=clock.getContext("2d");
function drawNow(){
var now=new Date();
var hour=now.getHours();
var min=now.getMinutes();
var sec=now.getSeconds();
hour=hour12?hour-12:hour;
hour=hour+min/60;
//表盤(藍色)
cxt.lineWidth=10;
cxt.strokeStyle="blue"
cxt.beginPath();
cxt.arc(250,250,200,0,360,false);
cxt.closePath();
cxt.stroke();
//刻度
//時刻度
for(var i=0;i12;i++){
cxt.save();
cxt.lineWidth=7;
cxt.strokeStyle="black";
cxt.translate(250,250);
cxt.rotate(i*30*Math.PI/180);//旋轉(zhuǎn)角度 角度*Math.PI/180=弧度
cxt.beginPath();
cxt.moveTo(0,-170);
cxt.lineTo(0,-190);
cxt.closePath();
cxt.stroke();
cxt.restore();
}
//分刻度
for(var i=0;i60;i++){
cxt.save();
//設(shè)置分刻度的粗細
cxt.lineWidth=5;
//重置畫布原點
cxt.translate(250,250);
//設(shè)置旋轉(zhuǎn)角度
cxt.rotate(i*6*Math.PI/180);
//畫分針刻度
cxt.strokeStyle="black";
cxt.beginPath();
cxt.moveTo(0,-180);
cxt.lineTo(0,-190);
cxt.closePath();
cxt.stroke();
cxt.restore();
}
//時針
cxt.save();
// 設(shè)置時針風格
cxt.lineWidth=7;
cxt.strokeStyle="black";
cxt.translate(250,250);
cxt.rotate(hour*30*Math.PI/180);
cxt.beginPath();
cxt.moveTo(0,-140);
cxt.lineTo(0,10);
cxt.closePath();
cxt.stroke();
cxt.restore();
//分針
cxt.save();
cxt.lineWidth=5;
cxt.strokeStyle="black";
//設(shè)置異次元空間分針畫布的中心
cxt.translate(250,250);
cxt.rotate(min*6*Math.PI/180);
cxt.beginPath();
cxt.moveTo(0,-160);
cxt.lineTo(0,15);
cxt.closePath();
cxt.stroke()
cxt.restore();
//秒針
cxt.save();
//設(shè)置秒針的風格
//顏色:紅色
cxt.strokeStyle="red";
cxt.lineWidth=3;
//重置原點
cxt.translate(250,250);
//設(shè)置角度
//cxt.rotate(330*Math.PI/180);
cxt.rotate(sec*6*Math.PI/180);
cxt.beginPath();
cxt.moveTo(0,-170);
cxt.lineTo(0,20);
cxt.closePath();
cxt.stroke();
//畫出時針,分針,秒針的交叉點
cxt.beginPath();
cxt.arc(0,0,5,0,360,false);
cxt.closePath();
//設(shè)置填充
cxt.fillStyle="gray";
cxt.fill();
//cxt.strokeStyle="red";
cxt.stroke();
//畫出秒針的小圓點
cxt.beginPath();
cxt.arc(0,-140,5,0,360,false);
cxt.closePath();
//設(shè)置填充
cxt.fillStyle="gray";
cxt.fill();
//cxt.strokeStyle="red";
cxt.stroke();/p
p cxt.restore();/p
p}
function drawClock(){
cxt.clearRect(0,0,500,500);
drawNow();
}
drawNow();
setInterval(drawClock,1000);
當前名稱:html5表盤,css表盤
分享網(wǎng)址:http://chinadenli.net/article48/dsepphp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供云服務(wù)器、微信小程序、建站公司、網(wǎng)站設(shè)計、網(wǎng)頁設(shè)計公司、軟件開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)