Cesium繪制雙實(shí)線(xiàn)

最近有個(gè)項(xiàng)目要用到道路的雙實(shí)線(xiàn),于是研究了一下Polyline的用法,發(fā)現(xiàn)在現(xiàn)有的PolylineGlowMaterial基礎(chǔ)上稍微改動(dòng)一下就可以用,把中間發(fā)光區(qū)域alpha設(shè)置為0就可以了,使用的時(shí)候taperPower設(shè)置為1,或者直接不要都可以。

czm_material czm_getMaterial(czm_materialInput materialInput)
{
    czm_material material = czm_getDefaultMaterial(materialInput);

    vec2 st = materialInput.st;
    float glow = glowPower / abs(st.t - 0.5) - (glowPower / 0.5);

    if (taperPower <= 0.99999) {
        glow *= min(1.0, taperPower / (0.5 - st.s * 0.5) - (taperPower / 0.5));
    }

    vec4 fragColor;
    fragColor.rgb = max(vec3(glow - 1.0 + color.rgb), color.rgb);
    if(glow - 1.0 > 0.0) {
        fragColor.a = 0.0; 
    } else {
        fragColor.a = color.a;
    }
    fragColor = czm_gammaCorrect(fragColor);

    material.emission = fragColor.rgb;
    material.alpha = fragColor.a;

    return material;
}

也可以用紋理坐標(biāo)直接計(jì)算,直接設(shè)置alpha為0,或者直接discard都可以。

czm_material czm_getMaterial(czm_materialInput materialInput)
{
    czm_material material = czm_getDefaultMaterial(materialInput);
    vec2 st = materialInput.st;
    vec4 fragColor = color;
    if(st.t < 0.5 + intervalRatio * 0.5 && st.t > 0.5 - intervalRatio * 0.5) {
        fragColor.a = 0.0; 
    } else {
        fragColor.a = color.a;
    }
    fragColor = czm_gammaCorrect(fragColor);

    material.emission = fragColor.rgb;
    material.alpha = fragColor.a;

    return material;
}

效果如下:


不要壓線(xiàn)!不要壓線(xiàn)!不要壓線(xiàn)!
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • @(HTML5)[canvas與SVG] [TOC] 十一 、SVG HTML體系中,最常用的繪制矢量圖的技術(shù)是S...
    踏浪free閱讀 4,773評(píng)論 0 2
  • 學(xué)會(huì)使用CSS選擇器熟記CSS樣式和外觀屬性熟練掌握CSS各種選擇器熟練掌握CSS各種選擇器熟練掌握CSS三種顯示...
    七彩小鹿閱讀 6,445評(píng)論 2 66
  • # CSS樣式規(guī)則overflow 使用HTML時(shí),需要遵從一定的規(guī)范。CSS亦如此,要想熟練地使用CSS對(duì)網(wǎng)頁(yè)進(jìn)...
    低調(diào)迷人的反派角色閱讀 1,082評(píng)論 0 1
  • # css: > 1. 學(xué)會(huì)使用CSS選擇器 > 2. 熟記CSS樣式和外觀屬性 > 3. 熟練掌握CSS各種選擇...
    欣簡(jiǎn)書(shū)閱讀 174評(píng)論 0 0
  • 課程目標(biāo): 學(xué)會(huì)使用CSS選擇器熟記CSS樣式和外觀屬性熟練掌握CSS各種選擇器熟練掌握CSS各種選擇器熟練掌握C...
    前端陳陳陳閱讀 330評(píng)論 0 1

友情鏈接更多精彩內(nèi)容