jianghe2nd/mota-js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Merge pull request #272 from ckcz123/status-canvas

Browse Source 
Status canvas
This commit is contained in:
Zhang Chen 2018-12-09 16:27:24 +08:00 committed by GitHub
commit 8d4d1a708f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 212 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
_server/data.comment.js
View File

@ -569,6 +569,18 @@ var data_comment_c456ea59_6018_45ef_8bcc_211a24c627dc =
"_bool": "bool",
"_data": "点击“开始游戏”后是否立刻开始游戏而不显示难度选择界面"
},
"statusCanvas": {
"_leaf": true,
"_type": "checkbox",
"_bool": "bool",
"_data": "是否状态栏canvas化，即手动自定义绘制状态栏。\n如果此项开启，则可在脚本编辑的drawStatusBar中自定义绘制菜单栏。"
},
"statusCanvasRowsOnMobile": {
"_leaf": true,
"_type": "textarea",
"_range": "thiseval==null || (thiseval>0 && thiseval<=4)",
"_data": "竖屏模式下，顶端状态栏canvas化后的行数。\n此项将决定竖屏的状态栏高度，如果设置则不小于1且不大于4。\n仅在statusCanvas开启时才有效"
},
"canOpenBattleAnimate": {
"_leaf": true,
"_type": "checkbox",

6
_server/functions.comment.js
View File

@ -169,6 +169,12 @@ var functions_comment_c456ea59_6018_45ef_8bcc_211a24c627dc =
"_leaf": false,
"_type": "object",
"_data": {
"drawStatusBar": {
"_leaf": true,
"_type": "textarea",
"_lint": true,
"_data": "自定义绘制状态栏。\n当状态栏canvas化开启时，可以在这里对状态栏进行自定义绘制。\n仅当statusCanvas开启时有效。"
},
"drawStatistics": {
"_leaf": true,
"_type": "textarea",

11
editor-mobile.html
View File

@ -353,7 +353,7 @@
<img id="img-hpmax">
<p class='statusLabel statusText' id='hpmax'></p>
</div>
<div class="status">
<div class="status" id='hpCol'>
<img id="img-hp">
<p class='statusLabel statusText' id='hp'></p>
</div>
@ -361,11 +361,11 @@
<img id="img-mana">
<p class='statusLabel statusText' id='mana'></p>
</div>
<div class="status">
<div class="status" id='atkCol'>
<img id="img-atk">
<p class='statusLabel statusText' id='atk'></p>
</div>
<div class="status">
<div class="status" id='defCol'>
<img id="img-def">
<p class='statusLabel statusText' id='def'></p>
</div>
@ -377,7 +377,7 @@
<img id="img-money">
<p class='statusLabel statusText' id='money'></p>
</div>
<div class="status" id="expCol">
<div class="status" id="experienceCol">
<img id="img-experience">
<p class='statusLabel statusText' id='experience'></p>
</div>
@ -404,6 +404,9 @@
<span class='statusLabel' id='weak' style="color: #FECCD0;"></span>
<span class='statusLabel' id='curse' style="color: #C2F4E7;"></span>
</div>
<!-- 状态栏canvas化 -->
<canvas id="statusCanvas"></canvas>
</div>
<div id="toolBar" class="clearfix">
<img class="tools" id='img-book'>

11
editor.html
View File

@ -339,7 +339,7 @@
<img id="img-hpmax">
<p class='statusLabel statusText' id='hpmax'></p>
</div>
<div class="status">
<div class="status" id='hpCol'>
<img id="img-hp">
<p class='statusLabel statusText' id='hp'></p>
</div>
@ -347,11 +347,11 @@
<img id="img-mana">
<p class='statusLabel statusText' id='mana'></p>
</div>
<div class="status">
<div class="status" id='atkCol'>
<img id="img-atk">
<p class='statusLabel statusText' id='atk'></p>
</div>
<div class="status">
<div class="status" id='defCol'>
<img id="img-def">
<p class='statusLabel statusText' id='def'></p>
</div>
@ -363,7 +363,7 @@
<img id="img-money">
<p class='statusLabel statusText' id='money'></p>
</div>
<div class="status" id="expCol">
<div class="status" id="experienceCol">
<img id="img-experience">
<p class='statusLabel statusText' id='experience'></p>
</div>
@ -390,6 +390,9 @@
<span class='statusLabel' id='weak' style="color: #FECCD0;"></span>
<span class='statusLabel' id='curse' style="color: #C2F4E7;"></span>
</div>
<!-- 状态栏canvas化 -->
<canvas id="statusCanvas"></canvas>
</div>
<div id="toolBar" class="clearfix">
<img class="tools" id='img-book'>

11
index.html
View File

@ -58,7 +58,7 @@
<img id="img-hpmax">
<p class='statusLabel statusText' id='hpmax'></p>
</div>
<div class="status">
<div class="status" id='hpCol'>
<img id="img-hp">
<p class='statusLabel statusText' id='hp'></p>
</div>
@ -66,11 +66,11 @@
<img id="img-mana">
<p class='statusLabel statusText' id='mana'></p>
</div>
<div class="status">
<div class="status" id='atkCol'>
<img id="img-atk">
<p class='statusLabel statusText' id='atk'></p>
</div>
<div class="status">
<div class="status" id='defCol'>
<img id="img-def">
<p class='statusLabel statusText' id='def'></p>
</div>
@ -82,7 +82,7 @@
<img id="img-money">
<p class='statusLabel statusText' id='money'></p>
</div>
<div class="status" id="expCol">
<div class="status" id="experienceCol">
<img id="img-experience">
<p class='statusLabel statusText' id='experience'></p>
</div>
@ -109,6 +109,9 @@
<span class='statusLabel' id='weak' style="color: #FECCD0;"></span>
<span class='statusLabel' id='curse' style="color: #C2F4E7;"></span>
</div>
<!-- 状态栏canvas化 -->
<canvas id="statusCanvas" style="position: absolute; left: 0; top: 0;"></canvas>
</div>
<div id="toolBar" class="clearfix">
<img class="tools" id='img-book'>

17
libs/actions.js
View File

@ -432,16 +432,13 @@ actions.prototype.getClickLoc = function (x, y) {
var size = 32;
size = size * core.domStyle.scale;
switch (core.domStyle.screenMode) {// 这里的3是指statusBar和游戏画布之间的白线宽度
case 'vertical':
statusBar.x = 0;
statusBar.y = core.dom.statusBar.offsetHeight + 3;
break;
case 'horizontal':
case 'bigScreen':
statusBar.x = core.dom.statusBar.offsetWidth + 3;
statusBar.y = 0;
break;
if (core.domStyle.isVertical) {
statusBar.x = 0;
statusBar.y = core.dom.statusBar.offsetHeight + 3;
}
else {
statusBar.x = core.dom.statusBar.offsetWidth + 3;
statusBar.y = 0;
}
var left = core.dom.gameGroup.offsetLeft + statusBar.x;

200
libs/control.js
View File

@ -2877,31 +2877,30 @@ control.prototype.updateGlobalAttribute = function (name) {
if (!core.isset(attribute)) return;
switch (name) {
case 'statusLeftBackground':
if (core.domStyle.screenMode == 'horizontal' || core.domStyle.screenMode == 'bigScreen') {
if (!core.domStyle.isVertical) {
core.dom.statusBar.style.background = attribute[name];
}
break;
case 'statusTopBackground':
if (core.domStyle.screenMode == 'vertical') {
if (core.domStyle.isVertical) {
core.dom.statusBar.style.background = attribute[name];
}
break;
case 'toolsBackground':
if (core.domStyle.screenMode == 'vertical') {
if (core.domStyle.isVertical) {
core.dom.toolBar.style.background = attribute[name];
}
break;
case 'borderColor':
{
var border = '3px ' + attribute[name] + ' solid';
var isVertical = core.domStyle.screenMode == 'vertical';
core.dom.statusBar.style.borderTop = border;
core.dom.statusBar.style.borderLeft = border;
core.dom.statusBar.style.borderRight = isVertical?'':border;
core.dom.statusBar.style.borderRight = core.domStyle.isVertical?'':border;
core.dom.gameDraw.style.border = border;
core.dom.toolBar.style.borderBottom = border;
core.dom.toolBar.style.borderLeft = border;
core.dom.toolBar.style.borderRight = isVertical?'':border;
core.dom.toolBar.style.borderRight = core.domStyle.isVertical?'':border;
break;
}
case 'statusBarColor':
@ -2928,7 +2927,7 @@ control.prototype.setToolbarButton = function (useButton) {
if (!core.domStyle.showStatusBar) return;
if (!core.isset(useButton)) useButton = core.domStyle.toolbarBtn;
if (core.domStyle.screenMode != 'vertical') useButton = false;
if (!core.domStyle.isVertical) useButton = false;
core.domStyle.toolbarBtn = useButton;
if (useButton) {
@ -2946,7 +2945,37 @@ control.prototype.setToolbarButton = function (useButton) {
["book","fly","toolbox","shop","save","load","settings"].forEach(function (t) {
core.statusBar.image[t].style.display = 'block';
});
core.statusBar.image.shop.style.display = core.domStyle.screenMode != 'vertical' ? "none":"block";
core.statusBar.image.shop.style.display = core.domStyle.isVertical ? "block":"none";
}
}
control.prototype.needDraw = function(id) {
if (!core.isset(id)) {
var toDraw = [], status = core.dom.status;
for (var i = 0; i<status.length; ++i) {
var dom = core.dom.status[i], idCol = dom.id;
if (idCol.indexOf("Col")!=idCol.length-3) continue;
var id = idCol.substring(0, idCol.length-3);
if (!this.needDraw(id)) continue;
toDraw.push(id);
}
return toDraw;
}
switch (id) {
case 'floor': return core.flags.enableFloor;
case 'name': return core.flags.enableName;
case 'lv': return core.flags.enableLv;
case 'hpmax': return core.flags.enableHPMax;
case 'mana': return core.flags.enableMana;
case 'mdef': return core.flags.enableMDef;
case 'money': return core.flags.enableMoney;
case 'experience': return core.flags.enableExperience && !core.flags.levelUpLeftMode;
case 'up': return core.flags.enableLevelUp;
case 'skill': return core.flags.enableSkill;
case 'key': return core.flags.enableKeys;
case 'pzf': return core.flags.enablePZF;
case 'debuff': return core.flags.enableDebuff;
default: return true;
}
}
@ -2979,25 +3008,16 @@ control.prototype.resize = function(clientWidth, clientHeight) {
statusWidth, statusHeight, statusMaxWidth,statusLabelsLH,
toolBarWidth, toolBarHeight, toolBarTop, toolBarBorder,
toolsWidth, toolsHeight,toolsMargin,toolsPMaxwidth,
fontSize, toolbarFontSize, margin, statusBackground, toolsBackground;
fontSize, toolbarFontSize, margin, statusBackground, toolsBackground,
statusCanvasWidth, statusCanvasHeight;
var count = core.dom.statusBar.children.length;
if (!core.flags.enableFloor) count--;
if (!core.flags.enableLv) count--;
if (!core.flags.enableHPMax) count--;
if (!core.flags.enableMDef) count--;
if (!core.flags.enableMoney) count--;
if (!core.flags.enableExperience) count--;
if (!core.flags.enableLevelUp) count--;
if (core.flags.levelUpLeftMode) count--;
if (!core.flags.enableDebuff) count--;
if (!core.flags.enableKeys) count--;
if (!core.flags.enablePZF) count--;
if (!core.flags.enableName) count--;
if (!core.flags.enableMana) count--;
if (!core.flags.enableSkill) count--;
var toDraw = this.needDraw();
var count = toDraw.length;
var statusCanvas = core.flags.statusCanvas, statusCanvasRows = core.flags.statusCanvasRowsOnMobile || 3;
if (count>12) alert("当前状态栏数目("+count+")大于12，请调整到不超过12以避免手机端出现显示问题。");
if (!statusCanvas && count>12) alert("当前状态栏数目("+count+")大于12，请调整到不超过12以避免手机端出现显示问题。");
var col = Math.ceil(count / 3);
if (statusCanvas) col = statusCanvasRows;
var statusLineHeight = BASE_LINEHEIGHT * 9 / count;
var statusLineFontSize = DEFAULT_FONT_SIZE;
@ -3029,11 +3049,9 @@ control.prototype.resize = function(clientWidth, clientHeight) {
var tempWidth = DEFAULT_CANVAS_WIDTH * scale;
if(!isHorizontal){ //竖屏
core.domStyle.screenMode = 'vertical';
core.domStyle.isVertical = true;
//显示快捷商店图标
shopDisplay = 'block';
//判断应该显示几行
// var col = core.flags.enableMDef || core.flags.enableExperience || core.flags.enableDebuff ? 3 : 2;
var col = parseInt((count-1)/3)+1;
var tempTopBarH = scale * (BASE_LINEHEIGHT * col + SPACE * 2) + 6;
var tempBotBarH = scale * (BASE_LINEHEIGHT + SPACE * 4) + 6;
@ -3041,6 +3059,8 @@ control.prototype.resize = function(clientWidth, clientHeight) {
gameGroupHeight = tempWidth + tempTopBarH + tempBotBarH;
gameGroupWidth = tempWidth
statusCanvasWidth = canvasWidth;
statusCanvasHeight = tempTopBarH;
canvasTop = tempTopBarH;
// canvasLeft = 0;
toolBarWidth = statusBarWidth = canvasWidth;
@ -3066,6 +3086,7 @@ control.prototype.resize = function(clientWidth, clientHeight) {
toolbarFontSize = DEFAULT_FONT_SIZE * scale;
}else { //横屏
core.domStyle.screenMode = 'horizontal';
core.domStyle.isVertical = false;
shopDisplay = 'none';
gameGroupWidth = tempWidth + DEFAULT_BAR_WIDTH * scale;
gameGroupHeight = tempWidth;
@ -3074,6 +3095,8 @@ control.prototype.resize = function(clientWidth, clientHeight) {
toolBarWidth = statusBarWidth = DEFAULT_BAR_WIDTH * scale;
statusBarHeight = gameGroupHeight - SPACE;
statusBarBorder = '3px '+borderColor+' solid';
statusCanvasWidth = toolBarWidth + SPACE;
statusCanvasHeight = statusBarHeight;
statusBackground = (core.status.globalAttribute||core.initStatus.globalAttribute).statusLeftBackground;
statusHeight = scale*statusLineHeight * .8;
@ -3096,6 +3119,7 @@ control.prototype.resize = function(clientWidth, clientHeight) {
}else { //大屏设备 pc端
core.domStyle.scale = 1;
core.domStyle.screenMode = 'bigScreen';
core.domStyle.isVertical = false;
shopDisplay = 'none';
gameGroupWidth = DEFAULT_CANVAS_WIDTH + DEFAULT_BAR_WIDTH;
@ -3108,6 +3132,8 @@ control.prototype.resize = function(clientWidth, clientHeight) {
// statusBarHeight = statusLineHeight * count + SPACE * 2; //一共有9行
statusBackground = (core.status.globalAttribute||core.initStatus.globalAttribute).statusLeftBackground;
statusBarHeight = gameGroupHeight - SPACE;
statusCanvasWidth = toolBarWidth + SPACE;
statusCanvasHeight = statusBarHeight;
statusHeight = statusLineHeight * .8;
statusLabelsLH = .8 * statusLineHeight;
@ -3143,6 +3169,14 @@ control.prototype.resize = function(clientWidth, clientHeight) {
height: (canvasWidth - SPACE*2) + unit,
}
},
{
id: 'statusCanvas',
rules: {
width: (statusCanvasWidth - SPACE*2) + unit,
height: (statusCanvasHeight - SPACE) + unit,
display: statusCanvas?'block':'none'
}
},
{
id: 'gif',
rules: {
@ -3157,15 +3191,6 @@ control.prototype.resize = function(clientWidth, clientHeight) {
height:(canvasWidth - SPACE*2) + unit,
}
},
/*
{
id: 'curtain',
rules: {
width: (canvasWidth - SPACE*2) + unit,
height:(canvasWidth - SPACE*2) + unit,
}
},
*/
{
id: 'gameDraw',
rules: {
@ -3209,7 +3234,8 @@ control.prototype.resize = function(clientWidth, clientHeight) {
width: '100%',
maxWidth: statusMaxWidth + unit,
height: statusHeight + unit,
margin: margin/2 + unit
margin: margin/2 + unit,
display: !statusCanvas?'block':'none'
}
},
{
@ -3255,84 +3281,6 @@ control.prototype.resize = function(clientWidth, clientHeight) {
display: shopDisplay && core.domStyle.showStatusBar
}
},
{
id: 'floorCol',
rules: {
display: core.flags.enableFloor ? 'block': 'none'
}
},
{
id: 'nameCol',
rules: {
display: core.flags.enableName ? 'block': 'none'
}
},
{
id: 'lvCol',
rules: {
display: core.flags.enableLv ? 'block': 'none'
}
},
{
id: 'hpmaxCol',
rules: {
display: core.flags.enableHPMax ? 'block': 'none'
}
},
{
id: 'manaCol',
rules: {
display: core.flags.enableMana ? 'block': 'none'
}
},
{
id: 'mdefCol',
rules: {
display: core.flags.enableMDef ? 'block': 'none'
}
},
{
id: 'moneyCol',
rules: {
display: core.flags.enableMoney ? 'block': 'none'
}
},
{
id: 'expCol',
rules: {
display: core.flags.enableExperience && !core.flags.levelUpLeftMode ? 'block': 'none'
}
},
{
id: 'upCol',
rules: {
display: core.flags.enableLevelUp ? 'block': 'none'
}
},
{
id: 'skillCol',
rules: {
display: core.flags.enableSkill ? 'block': 'none'
}
},
{
id: 'keyCol',
rules: {
display: !core.isset(core.flags.enableKeys)||core.flags.enableKeys?'block':'none'
}
},
{
id: 'pzfCol',
rules: {
display: core.flags.enablePZF?'block':'none'
}
},
{
'id': 'debuffCol',
rules: {
display: core.flags.enableDebuff ? 'block': 'none'
}
},
{
id: 'hard',
rules: {
@ -3341,8 +3289,28 @@ control.prototype.resize = function(clientWidth, clientHeight) {
}
},
]
for (var i = 0; i < core.dom.status.length; ++i) {
var id = core.dom.status[i].id;
core.domStyle.styles.push({
id: id,
rules: {
display: toDraw.indexOf(id.substring(0, id.length-3))>=0 && !statusCanvas ? "block": "none"
}
});
}
core.domRenderer();
this.setToolbarButton();
if (core.domStyle.isVertical) {
core.dom.statusCanvas.width = 416;
core.dom.statusCanvas.height = col * BASE_LINEHEIGHT + SPACE + 6;
}
else {
core.dom.statusCanvas.width = 129;
core.dom.statusCanvas.height = 416;
}
this.updateStatusBar();
}
////// 渲染DOM //////

7
libs/core.js
View File

@ -77,6 +77,8 @@ function core() {
this.domStyle = {
styles: [],
scale: 1.0,
screenMode: null,
isVertical: false,
toolbarBtn: false,
showStatusBar: true,
}
@ -1389,6 +1391,11 @@ core.prototype.updateStatusBar = function () {
core.control.updateStatusBar();
}
////// 绘制状态栏 //////
core.prototype.drawStatusBar = function () {
core.ui.drawStatusBar();
}
////// 屏幕分辨率改变后重新自适应 //////
core.prototype.resize = function(clientWidth, clientHeight) {
core.control.resize(clientWidth, clientHeight);

6
libs/ui.js
View File

@ -2394,6 +2394,12 @@ ui.prototype.drawKeyBoard = function () {
core.fillText("ui", "返回游戏", 416-80, offset-3, '#FFFFFF', 'bold 15px '+globalFont);
}
////// 绘制状态栏 /////
ui.prototype.drawStatusBar = function () {
if (this.uidata.drawStatusBar)
this.uidata.drawStatusBar();
}
////// 绘制“数据统计”界面 //////
ui.prototype.drawStatistics = function () {

6
main.js
View File

@ -55,16 +55,20 @@ function main() {
'nameCol': document.getElementById('nameCol'),
'lvCol': document.getElementById('lvCol'),
'hpmaxCol': document.getElementById('hpmaxCol'),
'hpCol': document.getElementById('hpCol'),
'manaCol': document.getElementById('manaCol'),
'atkCol': document.getElementById('atkCol'),
'defCol': document.getElementById('defCol'),
'mdefCol': document.getElementById('mdefCol'),
'moneyCol': document.getElementById('moneyCol'),
'expCol': document.getElementById('expCol'),
'experienceCol': document.getElementById('experienceCol'),
'upCol': document.getElementById('upCol'),
'keyCol': document.getElementById('keyCol'),
'pzfCol': document.getElementById('pzfCol'),
'debuffCol': document.getElementById('debuffCol'),
'skillCol': document.getElementById('skillCol'),
'hard': document.getElementById('hard'),
'statusCanvas': document.getElementById('statusCanvas')
};
this.mode = 'play';
this.loadList = [

2
project/data.js
View File

@ -370,6 +370,8 @@ var data_a1e2fb4a_e986_4524_b0da_9b7ba7c0874d =
"useLoop": false,
"startUsingCanvas": false,
"startDirectly": false,
"statusCanvas": false,
"statusCanvasRowsOnMobile": 3,
"canOpenBattleAnimate": true,
"showBattleAnimateConfirm": false,
"battleAnimate": false,

62
project/functions.js
View File

@ -864,6 +864,8 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
// 难度
core.statusBar.hard.innerHTML = core.status.hard;
// 状态栏绘制
core.drawStatusBar();
// 更新阻激夹域的伤害值
core.updateCheckBlock();
@ -1002,6 +1004,66 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
}
},
"ui": {
"drawStatusBar": function () {
// 如果是非状态栏canvas化，直接返回
if (!core.flags.statusCanvas) return;
var canvas = core.dom.statusCanvas, ctx = canvas.getContext('2d');
// 清空状态栏
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 如果是隐藏状态栏模式，直接返回
if (!core.domStyle.showStatusBar) return;
// 作为样板，只绘制楼层、生命、攻击、防御、魔防、金币、钥匙这七个内容
// 需要其他的请自行进行修改；横竖屏都需要进行适配绘制。
// （可以使用Chrome浏览器开控制台来模拟手机上的竖屏模式的显示效果，具体方式自行百度）
// 横屏模式下的画布大小是 129*416
// 竖屏模式下的画布大小是 416*(32*rows+9) 其中rows为状态栏行数，即全塔属性中statusCanvasRowsOnMobile值
// 可以使用 core.domStyle.isVertical 来判定当前是否是竖屏模式
ctx.fillStyle = core.status.globalAttribute.statusBarColor || core.initStatus.globalAttribute.statusBarColor;
ctx.font = 'italic bold 18px Verdana';
// 距离左侧边框6像素，上侧边框9像素，行距约为39像素
var leftOffset = 6, topOffset = 9, lineHeight = 39;
if (core.domStyle.isVertical) { // 竖屏模式，行高32像素
leftOffset = 6; topOffset = 6; lineHeight = 32;
}
var toDraw = ["floor", "hp", "atk", "def", "mdef", "money"];
for (var index = 0; index < toDraw.length; index++) {
// 绘制下一个数据
var name = toDraw[index];
// 图片大小25x25
ctx.drawImage(core.statusBar.icons[name], leftOffset, topOffset, 25, 25);
// 文字内容
var text = (core.statusBar[name]||{}).innerText || " ";
// 斜体判定：如果不是纯数字，斜体会非常难看，需要取消
if (!/^\d*$/.test(text)) ctx.font = 'bold 18px Verdana';
// 绘制文字
ctx.fillText(text, leftOffset + 36, topOffset + 20);
ctx.font = 'italic bold 18px Verdana';
// 计算下一个绘制的坐标
if (core.domStyle.isVertical) {
// 竖屏模式
if (index % 3 != 2) leftOffset += 131;
else {
leftOffset = 6;
topOffset += lineHeight;
}
}
else {
// 横屏模式
topOffset += lineHeight;
}
}
// 绘制三色钥匙
ctx.fillStyle = '#FFCCAA';
ctx.fillText(core.statusBar.yellowKey.innerText, leftOffset + 5, topOffset + 20);
ctx.fillStyle = '#AAAADD';
ctx.fillText(core.statusBar.blueKey.innerText, leftOffset + 40, topOffset + 20);
ctx.fillStyle = '#FF8888';
ctx.fillText(core.statusBar.redKey.innerText, leftOffset + 75, topOffset + 20);
},
"drawStatistics": function () {
// 浏览地图时参与的统计项目