three.js 场景编辑器源码解析（二）

最新推荐文章于 2025-11-18 22:47:16 发布

原创

最新推荐文章于 2025-11-18 22:47:16 发布 · 2.7k 阅读

11 ·

CC 4.0 BY-SA版权

本文详细介绍了three.js场景编辑器的配置信息，包括如何存储和读取配置，以及默认配置的各项参数，如语言、自动保存、主题、标题、编辑按钮等。此外，还解释了如何通过浏览器的localStorage来持久化用户的自定义配置。

three.js场景编辑器的一些初始配置信息存放在editor\js\Config.js下,当第一次加载的时候，编辑器会使用这个配置文件设置默认配置，并将这些配置信息存储在浏览器的window.localStorage，当再次打开编辑器时会从浏览器本地的window.localStorage读取这些配置，特别是当用户自己设定了一些配置项时很有用。

//配置的内容，初始化时会依照这些内容进行初始化，修改完成保存，下次打开时会按照改变的东西初始化
var Config = function () {

	var name = 'threejs-editor';

	//默认初始化的内容
	var storage = {
		'language': 'en',	//默认英语

		'autosave': true,	//默认自动保存
		'theme': 'css/light.css',	//默认主题

		'project/title': '',	//默认标题
		'project/editable': false,	//发布的场景是否有编辑按钮

		'project/renderer': 'WebGLRenderer',	//默认的渲染方式
		'project/renderer/antialias': true,		//默认的抗锯齿
		'project/renderer/shadows': true,		//默认阴影开启转台

		'project/vr': false,					//默认vr方式

		'settings/history': false,				//默认历史

		'settings/shortcuts/translate': 'w',	//默认w为平移
		'settings/shortcuts/rotate': 'e',		//默认e为旋转
		'settings/shortcuts/scale': 'r',		//默认r为缩放
		'settings/shortcuts/undo': 'z',			//默认z为撤销
		'settings/shortcuts/focus': 'f'			//默认f为设置焦点
	};

	//获取localstri