指定返回的getPaintProperty方法Mapbox gl

Question

我想返回一個圖層的填充顏色，以便它可以用作變量來在正在構建爲單獨文檔的可打印地圖上填充動態圖例。

瀏覽器將只接收十六進制顏色，但getPaintProperty返回hsl。我知道Mapbox根據樣式/圖層保存這些信息，但我無法弄清楚如何訪問它。

有沒有辦法返回十六進制層填充顏色的值而不是？

這是通用代碼我用來訪問每個圖層填充顏色;

map.on("render", function() { 
    if(map.loaded()) { 
    console.log(map.getPaintProperty('layer id','fill-color')); 
    } 
    }); 

我目前的選擇是使用additional library來執行轉換。

Answer 1

你可以只使用一個通用的RGBA爲十六進制的功能：

//Function to convert hex format to a rgb color 
function rgb2hex(rgb){ 
    rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i); 
    return (rgb && rgb.length === 4) ? "#" + 
     ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) + 
     ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) + 
     ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : ''; 
} 

rgb2hex（map.getPaintProperty（ '公園'， '補色'））;

returns "#e6ebcc"