Javascript中文变量及dat.gui的使用

dat.gui是一款小巧轻便的可视化工具，配合使用在Three.js中非常方便。

首先导入js库

<script src="../examples/js/libs/dat.gui.min.js"></script>

再参考dat.gui的用法，由于dat.gui直接显示变量名称，原本以为只能显示英文了，国人看起来会非常别扭，但是抱着侥幸态度一试发现居然可以使用中文。Google了一下发现JavaScript支持Unioncode字符集。

    var bulbLuminousPowers = {
        /*"110000 lm (1000W)": 110000,*/
        "1000W": 110000,
        "300W": 3500,
        "100W": 1700,
        "60W": 800,
        "40W": 400,
        "25W": 180,
        "4W": 20,
        "关灯": 0
    };

    var hemiLuminousIrradiances = {

        "黑夜": 0.001,
        "稀月光": 0.2,
        "满月光": 0.5,
        "暮光": 3.4,
        "起居室": 35,
        "阴天": 45,
        "日落日出": 55,
        "多云": 70,
        "晴朗": 120,
        "阳光直射": 200,
    };

    var params = {
        阴影: true,
        exposure: 0.68,
       /* bulbPower: Object.keys(bulbLuminousPowers)[2],*/
        灯泡亮度: Object.keys(bulbLuminousPowers)[2],
        环境光: Object.keys(hemiLuminousIrradiances)[4]      //其实是半球光照
    };

初始化gui

        var gui = new dat.GUI();

        gui.add(params, '环境光', Object.keys(hemiLuminousIrradiances));
        gui.add(params, '灯泡亮度', Object.keys(bulbLuminousPowers));
        gui.add(params, '阴影');
        gui.open();

最终效果图