131 lines
3.4 KiB
JavaScript
131 lines
3.4 KiB
JavaScript
|
|
/*
|
|
* Licensed to the Apache Software Foundation (ASF) under one
|
|
* or more contributor license agreements. See the NOTICE file
|
|
* distributed with this work for additional information
|
|
* regarding copyright ownership. The ASF licenses this file
|
|
* to you under the Apache License, Version 2.0 (the
|
|
* "License"); you may not use this file except in compliance
|
|
* with the License. You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing,
|
|
* software distributed under the License is distributed on an
|
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
* KIND, either express or implied. See the License for the
|
|
* specific language governing permissions and limitations
|
|
* under the License.
|
|
*/
|
|
|
|
var zrUtil = require("zrender/lib/core/util");
|
|
|
|
var graphic = require("../util/graphic");
|
|
|
|
/*
|
|
* Licensed to the Apache Software Foundation (ASF) under one
|
|
* or more contributor license agreements. See the NOTICE file
|
|
* distributed with this work for additional information
|
|
* regarding copyright ownership. The ASF licenses this file
|
|
* to you under the Apache License, Version 2.0 (the
|
|
* "License"); you may not use this file except in compliance
|
|
* with the License. You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing,
|
|
* software distributed under the License is distributed on an
|
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
* KIND, either express or implied. See the License for the
|
|
* specific language governing permissions and limitations
|
|
* under the License.
|
|
*/
|
|
var PI = Math.PI;
|
|
/**
|
|
* @param {module:echarts/ExtensionAPI} api
|
|
* @param {Object} [opts]
|
|
* @param {string} [opts.text]
|
|
* @param {string} [opts.color]
|
|
* @param {string} [opts.textColor]
|
|
* @return {module:zrender/Element}
|
|
*/
|
|
|
|
function _default(api, opts) {
|
|
opts = opts || {};
|
|
zrUtil.defaults(opts, {
|
|
text: 'loading',
|
|
color: '#c23531',
|
|
textColor: '#000',
|
|
maskColor: 'rgba(255, 255, 255, 0.8)',
|
|
zlevel: 0
|
|
});
|
|
var mask = new graphic.Rect({
|
|
style: {
|
|
fill: opts.maskColor
|
|
},
|
|
zlevel: opts.zlevel,
|
|
z: 10000
|
|
});
|
|
var arc = new graphic.Arc({
|
|
shape: {
|
|
startAngle: -PI / 2,
|
|
endAngle: -PI / 2 + 0.1,
|
|
r: 10
|
|
},
|
|
style: {
|
|
stroke: opts.color,
|
|
lineCap: 'round',
|
|
lineWidth: 5
|
|
},
|
|
zlevel: opts.zlevel,
|
|
z: 10001
|
|
});
|
|
var labelRect = new graphic.Rect({
|
|
style: {
|
|
fill: 'none',
|
|
text: opts.text,
|
|
textPosition: 'right',
|
|
textDistance: 10,
|
|
textFill: opts.textColor
|
|
},
|
|
zlevel: opts.zlevel,
|
|
z: 10001
|
|
});
|
|
arc.animateShape(true).when(1000, {
|
|
endAngle: PI * 3 / 2
|
|
}).start('circularInOut');
|
|
arc.animateShape(true).when(1000, {
|
|
startAngle: PI * 3 / 2
|
|
}).delay(300).start('circularInOut');
|
|
var group = new graphic.Group();
|
|
group.add(arc);
|
|
group.add(labelRect);
|
|
group.add(mask); // Inject resize
|
|
|
|
group.resize = function () {
|
|
var cx = api.getWidth() / 2;
|
|
var cy = api.getHeight() / 2;
|
|
arc.setShape({
|
|
cx: cx,
|
|
cy: cy
|
|
});
|
|
var r = arc.shape.r;
|
|
labelRect.setShape({
|
|
x: cx - r,
|
|
y: cy - r,
|
|
width: r * 2,
|
|
height: r * 2
|
|
});
|
|
mask.setShape({
|
|
x: 0,
|
|
y: 0,
|
|
width: api.getWidth(),
|
|
height: api.getHeight()
|
|
});
|
|
};
|
|
|
|
group.resize();
|
|
return group;
|
|
}
|
|
|
|
module.exports = _default; |