提交 7a0d5f01 编写于 作者: K kener

例子更新,兼容性测试

上级 44555ad5
......@@ -207,7 +207,7 @@ option = {
],
markLine : {
data : [
{type : 'average', name : '平均值'}
{type : 'average', name : '平均值'},
{type : 'max'},
{type : 'min'}
]
......
......@@ -128,14 +128,14 @@ option = {
color: 'rgba(255,30,30,0.5)',
lineStyle : {
width: 1,
color: 'green',
color: 'green'
}
},
emphasis: {
color: 'yellow',
lineStyle : {
width: 2,
color: 'blue',
color: 'blue'
}
}
}
......
......@@ -162,11 +162,11 @@ option = {
color0: 'blue', // 阴线填充颜色
lineStyle: {
width: 3,
color0: 'blue', // 阴线边框颜色
color0: 'blue' // 阴线边框颜色
}
},
emphasis: {
color0: 'blue', // 阴线填充颜色
color0: 'blue' // 阴线填充颜色
}
}
},
......
......@@ -74,12 +74,9 @@ option = {
tooltip : {
trigger: 'axis',
formatter: function(params) {
var res = params[1][1];
res += '<br/>' + params[1][0];
res += '<br/> 开盘 : ' + params[1][2][0] + ' 最高 : ' + params[1][2][3];
res += '<br/> 收盘 : ' + params[1][2][1] + ' 最低 : ' + params[1][2][2];
res += '<br/>' + params[0][0];
res += ' : ' + params[0][2];
var res = params[0][0] + ' ' + params[0][1];
res += '<br/> 开盘 : ' + params[0][2][0] + ' 最高 : ' + params[0][2][3];
res += '<br/> 收盘 : ' + params[0][2][1] + ' 最低 : ' + params[0][2][2];
return res;
}
},
......
......@@ -113,6 +113,12 @@ option = {
]
})
}
series[0].markPoint = {
symbol:'emptyCircle',
symbolSize:series[0].radius[0],
effect:{show:true,scaleSize:12,color:'rgba(250,225,50,0.8)',shadowBlur:10,period:30},
data:[{x:'50%',y:'50%'}]
};
return series;
})()
};
......@@ -124,7 +130,7 @@ setTimeout(function(){
style : {
x : _ZR.getWidth() / 2,
y : _ZR.getHeight() / 2,
color: '#bbb',
color: '#666',
text : '恶梦的过去',
textAlign : 'center'
}
......@@ -134,9 +140,8 @@ setTimeout(function(){
style : {
x : _ZR.getWidth() / 2 + 200,
y : _ZR.getHeight() / 2,
brushType:'both',
brushType:'fill',
color: 'orange',
strokeColor: 'yellow',
text : '美好的未来',
textAlign : 'left',
textFont:'normal 20px 微软雅黑'
......
......@@ -129,7 +129,7 @@ option = {
}
}
}
},
}
}
],
markPoint : {
......
......@@ -68,12 +68,22 @@
<div class="nav-header"><a href="#" onclick="autoResize()" class="icon-resize-full" id ="icon-resize" ></a>option</div>
<textarea id="code" name="code">
option = {
title :{
text : '销售数据',
subtext : '纯属虚构'
},
tooltip : {
trigger: 'axis'
trigger: 'axis',
formatter: function(v){
return v[0][1] + ' : '
+ (v[0][2] - v[1][2] > 0 ? '+' : '-')
+ v[3][2] + '<br/>'
+ v[0][0] + ' : ' + v[0][2] + '<br/>'
+ v[1][0] + ' : ' + v[1][2] + '<br/>'
}
},
toolbox: {
show : true,
y: 'bottom',
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
......@@ -82,9 +92,9 @@ option = {
saveAsImage : {show: true}
}
},
calculable : true,
legend: {
data:['上周对比','本周变化']
data:['本周', '上周'],
selectedMode:false
},
xAxis : [
{
......@@ -95,42 +105,56 @@ option = {
yAxis : [
{
type : 'value',
power: 10,
min : 200,
max : 450,
splitArea : {show : true}
}
],
series : [
{
name:'上周对比2',
name:'本周',
type:'line',
data:[400, 374, 251, 300, 420, 400, 440]
},
{
name:'上周',
type:'line',
symbol:'none',
itemStyle:{
normal:{
lineStyle: {
width:1,
type:'dashed'
}
}
},
data:[320, 332, 301, 334, 360, 330, 350]
},
{
name:'上周2',
type:'bar',
stack: '1',
barWidth: 20,
tooltip : {
show: 'false',
trigger:'none'
},
barWidth: 6,
itemStyle:{
normal:{
borderColor:'rgba(0,0,0,0)',
color:'rgba(0,0,0,0)'
},
emphasis:{
borderColor:'rgba(0,0,0,0)',
color:'rgba(0,0,0,0)'
}
},
data:[320, 332, 200, 334, 300, 330, 320]
data:[320, 332, 251, 300, 360, 330, 350]
},
{
name:'本周变化',
name:'变化',
type:'bar',
stack: '1',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'上周对比',
type:'line',
data:[320, 332, 301, 334, 390, 330, 320]
data:[
80, 42,
{value : 50, itemStyle:{ normal:{color:'red'}}},
{value : 34, itemStyle:{ normal:{color:'red'}}},
60, 70, 90
]
}
]
};
......
......@@ -97,7 +97,7 @@ option = {
normal : {
label : {
position : 'inner',
formatter : function(a,b,c,d) {return (d - 0).toFixed(0) + '%'},
formatter : function(a,b,c,d) {return (d - 0).toFixed(0) + '%'}
},
labelLine : {
show : false
......@@ -106,8 +106,7 @@ option = {
emphasis : {
label : {
show : true,
formatter : "{b}\n{d}%",
position : 'inner'
formatter : "{b}\n{d}%"
}
}
......
......@@ -1910,42 +1910,45 @@ var optionMap = {
]
})
}
series[0].markPoint = {
symbol:'emptyCircle',
symbolSize:series[0].radius[0],
effect:{show:true,scaleSize:13,color:'rgba(250,225,50,0.8)',shadowBlur:10,period:30},
data:[{x:'50%',y:'50%'}]
};
return series;
})(),
calculable : (function(){
functionMap.mix4 = function() {
setTimeout(function(){
if (!myChart) {
return;
setTimeout(function(){
if (!myChart) {
return;
}
var _ZR = myChart.getZrender();
// 补充千层饼
_ZR.addShape({
shape : 'text',
style : {
x : _ZR.getWidth() / 2,
y : _ZR.getHeight() / 2,
color: '#666',
text : '恶梦的过去',
textAlign : 'center'
}
var _ZR = myChart.getZrender();
// 补充千层饼
_ZR.addShape({
shape : 'text',
style : {
x : _ZR.getWidth() / 2,
y : _ZR.getHeight() / 2,
color: '#bbb',
text : '恶梦的过去',
textAlign : 'center'
}
});
_ZR.addShape({
shape : 'text',
style : {
x : _ZR.getWidth() / 2 + 200,
y : _ZR.getHeight() / 2,
brushType:'both',
color: 'orange',
strokeColor: 'yellow',
text : '美好的未来',
textAlign : 'left',
textFont:'normal 20px 微软雅黑'
}
});
_ZR.refresh();
}, 2000);
}
});
_ZR.addShape({
shape : 'text',
style : {
x : _ZR.getWidth() / 2 + 200,
y : _ZR.getHeight() / 2,
brushType:'fill',
color: 'orange',
text : '美好的未来',
textAlign : 'left',
textFont:'normal 20px 微软雅黑'
}
});
_ZR.refresh();
}, 2000);
return false;
})()
}, true);
......
......@@ -431,7 +431,7 @@
<p>
<small>别因为图表的能力局限了你的创作力,<a href="http://ecomfe.github.io/echarts/" target="_blank">ECharts</a>拥有超过<strong>500</strong>项的配置选项,配合<strong>多级控制</strong>让它具备了高度个性化能力,开源后大量的应用反馈让研发团队吃惊,很多从未想过的图表样式被被创作出来了。 </small>
</p>
<img src="./img/creativity.jpg" style="width:100%;max-width:100%;margin:0;">
<img src="../asset/img/creativity.jpg" style="width:100%;max-width:100%;margin:0;">
</section>
<section>
......
......@@ -819,7 +819,7 @@ define(function() {
period: 15, // 运动周期,无单位,值越大越慢
scaleSize : 2 // 放大倍数,以markPoint点size为基准
// color : 'gold',
// shadowColor : 'rgba(255,215,0,0.8)'
// shadowColor : 'rgba(255,215,0,0.8)',
// shadowBlur : 0 // 炫光模糊
},
itemStyle: {
......@@ -860,8 +860,8 @@ define(function() {
show: false,
period: 15, // 运动周期,无单位,值越大越慢
scaleSize : 2 // 放大倍数,以markLine线lineWidth为基准
// color : 'gold'
// shadowColor : 'rgba(255,215,0,0.8)'
// color : 'gold',
// shadowColor : 'rgba(255,215,0,0.8)',
// shadowBlur : lineWidth * 2 // 炫光模糊,默认等于scaleSize计算所得
},
itemStyle: {
......
......@@ -410,9 +410,9 @@ option = {
markLine : {
data : [
[
{name : '周最低', value : 620, xAxis: '周一', yAxis: 620},
{name : '周最高', value : 930, xAxis: '周六', yAxis: 930}
{type : 'average', name : '平均值'},
{type : 'max'},
{type : 'min'}
]
]
}
......@@ -489,7 +489,7 @@ option = {
label : {show: true}
},
emphasis: {
color: 'lightgreen',
color: 'lightgreen'
}
},
data: (function() {
......@@ -672,11 +672,11 @@ option = {
color0: 'blue', // 阴线填充颜色
lineStyle: {
width: 3,
color0: 'blue', // 阴线边框颜色
color0: 'blue' // 阴线边框颜色
}
},
emphasis: {
color0: 'blue', // 阴线填充颜色
color0: 'blue' // 阴线填充颜色
}
}
},
......@@ -830,34 +830,24 @@ option = {
normal : {
label : {
position : 'inner',
formatter : function(a,b,c,d) {return (d - 0).toFixed(0) + ' %'},
formatter : function(a,b,c,d) {return (d - 0).toFixed(0) + '%'}
},
labelLine : {
show : false
}
},
emphasis : {
label : {
show : true,
formatter : "{b}\n{d}%"
}
}
},
data:[
{value:335, name:'直达'},
{value:679, name:'营销广告'},
{
value:1548,
name:'搜索引擎',
itemStyle : {
normal : {
label : {
show : false
}
},
emphasis : {
label : {
show : true,
formatter : "{b} : {d}%",
position : 'inner'
}
}
}
}
{value:1548, name:'搜索引擎'}
]
},
{
......@@ -1262,14 +1252,14 @@ option = {
color: 'rgba(255,30,30,0.5)',
lineStyle : {
width: 1,
color: 'green',
color: 'green'
}
},
emphasis: {
color: 'yellow',
lineStyle : {
width: 2,
color: 'blue',
color: 'blue'
}
}
}
......@@ -1506,7 +1496,7 @@ option = {
}
}
}
},
}
}
],
markPoint : {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册