mirror of
				https://github.com/jiawanlong/Cesium-Examples.git
				synced 2025-11-04 01:04:17 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			154 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			154 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
//初始化文本编辑器
 | 
						|
function initCode() {
 | 
						|
    var mylink;
 | 
						|
    var href = window.location.toString();
 | 
						|
    var mapUrl = href.substr(0, href.lastIndexOf('/') + 1);
 | 
						|
    if (href.indexOf("#") == -1) {
 | 
						|
        mylink = mapUrl + "3857Map.html";
 | 
						|
    } else {
 | 
						|
        mylink = mapUrl + href.split("#")[1] + ".html";
 | 
						|
    }
 | 
						|
    var html = $.ajax({url: mylink, async: false}).responseText; //获取网页文本内容
 | 
						|
    if (html && html != "") {
 | 
						|
        $('#code').val(html);
 | 
						|
    }
 | 
						|
    initEditor();
 | 
						|
}
 | 
						|
 | 
						|
function initEditor() {
 | 
						|
    if (!editor) {
 | 
						|
        editor = CodeMirror.fromTextArea(document.getElementById("code"), {
 | 
						|
            lineWrapping: true,       //是否换行
 | 
						|
            foldGutter: true,        //是否折叠
 | 
						|
            gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
 | 
						|
            lineNumbers: true,        //是否显示行号
 | 
						|
            styleActiveLine: true,
 | 
						|
            matchBrackets: true,
 | 
						|
            selectionPointer: true,
 | 
						|
            mode: "htmlmixed",
 | 
						|
            extraKeys: {           //自动补全
 | 
						|
                "Ctrl": "autocomplete"
 | 
						|
            },
 | 
						|
            viewportMargin: Infinity
 | 
						|
        });
 | 
						|
        //自动补全
 | 
						|
        CodeMirror.commands.autocomplete = function (cm) {
 | 
						|
            cm.showHint({hint: CodeMirror.hint.anyword});
 | 
						|
        };
 | 
						|
    } else {
 | 
						|
        editor.setValue($("#code").val());
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
/**将用户修改过的代码加载到iframe中**/
 | 
						|
function run() {
 | 
						|
    var iframeContent = $("#code").val();
 | 
						|
    if (editor) {
 | 
						|
        iframeContent = editor.getValue();
 | 
						|
    }
 | 
						|
 | 
						|
    var iFrame = document.getElementById("examplesIframe").contentWindow;
 | 
						|
    iFrame.document.open();
 | 
						|
    iFrame.document.write(iframeContent);
 | 
						|
    iFrame.document.close();
 | 
						|
}
 | 
						|
 | 
						|
//开关代码编辑器
 | 
						|
function toggleFooter() {
 | 
						|
    var code_area = $('#code_area');
 | 
						|
    var map = $('#mapContent');
 | 
						|
    if (code_area[0].offsetWidth <= 2) {//如果已经关闭,则打开
 | 
						|
        code_area.animate({
 | 
						|
            width: "37%"
 | 
						|
        }, 200);
 | 
						|
        map.animate({
 | 
						|
            width: "62%"
 | 
						|
        }, 200);
 | 
						|
    } else {
 | 
						|
        code_area.animate({
 | 
						|
            width: 0
 | 
						|
        }, 200);
 | 
						|
        map.animate({
 | 
						|
            width: "99.8%"
 | 
						|
        }, 200);
 | 
						|
    }
 | 
						|
    setTimeout(function () {
 | 
						|
        codeChange()
 | 
						|
    }, 200);
 | 
						|
}
 | 
						|
 | 
						|
//显示隐藏代码打开关闭按钮
 | 
						|
function codeChange() {
 | 
						|
    if ($("#code_area")[0].offsetWidth > 2) {
 | 
						|
        $("#code_open").hide();
 | 
						|
        $("#code_close").show();
 | 
						|
        $('#container-main').css("border", "1px solid #3473b7");
 | 
						|
        $('#drag').css("display", "block");
 | 
						|
    } else {
 | 
						|
        $("#code_close").hide();
 | 
						|
        $("#code_open").show();
 | 
						|
        $('#container-main').css("border", "0");
 | 
						|
        $('#drag').css("display", "none");
 | 
						|
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
//重置
 | 
						|
function refresh() {
 | 
						|
    initEditor();
 | 
						|
    run();
 | 
						|
}
 | 
						|
 | 
						|
//复制
 | 
						|
function copy() {
 | 
						|
    $('#foo').val(editor.getValue());
 | 
						|
    var clipboard = new Clipboard('.copy');
 | 
						|
 | 
						|
    clipboard.on('success', function (e) {
 | 
						|
        console.info('Action:', e.action);
 | 
						|
        console.info('Text:', e.text);
 | 
						|
        console.info('Trigger:', e.trigger);
 | 
						|
        e.clearSelection();
 | 
						|
        $(".copy-success").fadeIn("fast");
 | 
						|
        setTimeout(function(){
 | 
						|
            $(".copy-success").fadeOut("slow");
 | 
						|
        },2000);
 | 
						|
 | 
						|
    });
 | 
						|
 | 
						|
    clipboard.on('error', function (e) {
 | 
						|
        console.error('Action:', e.action);
 | 
						|
        console.error('Trigger:', e.trigger);
 | 
						|
    });
 | 
						|
}
 | 
						|
 | 
						|
//拖拽效果
 | 
						|
function dragCode() {
 | 
						|
    $("#drag").mousedown(function () {
 | 
						|
        var myWidth = $('#container-main').width();
 | 
						|
        //使目标对象“禁止变蓝”
 | 
						|
        document.onselectstart = function () {
 | 
						|
            return false;
 | 
						|
        };
 | 
						|
        document.onmousemove = function (e) {
 | 
						|
            var bottomX = (e || window.event).clientX - 0.3 * myWidth;
 | 
						|
            if ($("#overiframe").is(":hidden") == true) {
 | 
						|
                $("#overiframe").show();
 | 
						|
            }
 | 
						|
            if (bottomX <= 0) {
 | 
						|
                bottomX = 0;
 | 
						|
            }
 | 
						|
            if (bottomX >= myWidth * 0.6) {
 | 
						|
                bottomX = myWidth * 0.6;
 | 
						|
            }
 | 
						|
            $("#code_area").width(bottomX);
 | 
						|
            $("#mapContent").width(myWidth * 0.99 - bottomX);
 | 
						|
            $("#overiframe").width(myWidth * 0.99 - bottomX);
 | 
						|
        };
 | 
						|
        document.onmouseup = function () {
 | 
						|
            document.onmousemove = null;
 | 
						|
            $("#overiframe").hide();
 | 
						|
            codeChange();
 | 
						|
        };
 | 
						|
    });
 | 
						|
} |