Three.js Diorama

Prompt

用 Three.js 做一个等距视角的微缩小镇场景（diorama 摆件的感觉），单个 HTML 文件，所有几何和纹理全部代码程序化生成，不依赖外部模型和图片素材。小镇是座圆形小岛，中心广场向外是一圈环形主路和六条放射支路，沿街排布民居、商店、教堂、钟楼，远处有城堡、风车和谷仓，湖边立一座灯塔配码头，另有游乐园和外围的农庄牧场。地形用噪声高度场生成起伏，并按区域分出各自的地貌和配色——广场平坦、湖为盆地、农田做梯田、海岸为沙丘，还有林地、裸岩高地和缓坡牧场。建筑下方要自动开挖平台，道路做削坡填方，避免屋角悬空、被地形埋没或出现陡坡；湖面须低于四周地面，否则看起来像平板架在洼地上。在此之上按区域密度撒布树木花草，注意间距、不侵入路面和建筑。加入车辆、行人、小船、飞鸟，以及鹿羊牛狗猫兔等动物，动物要有四足对角步态、低头吃草，行走时身体贴合坡面倾斜；车与人分道行驶避免对穿。画面上配 PBR材质、阴影、雾和色调映射，天空、水面（远近深浅与掠射反光）、植被风摆用自定义 shader 实现，再补些炊烟、瀑布、喷泉、涟漪的细节。界面以昼夜时间轴为核心：底部居中一条控制栏，含播放暂停、时间轴滑块、倍速切换和一排时段预设（黎明到深夜），时间自动推进也可手动拖动，天光与窗户灯光实时联动。左上角是标题与时钟，右侧竖排是几个机位预设（俯瞰、广场、街巷、灯塔、游乐园、农庄、牧场）并附自动环绕，右上角显示帧率

A system prompt was added to support web rendering