提交 c9353850 编写于 作者: P pah100

Fix #5777 (exception "unexpected call to method or property access" might be...

Fix #5777 (exception "unexpected call to method or property access" might be thrown when calling ctx.fill or ctx.stroke after a path whose area size is zero is drawn and ctx.clip() is called and shadowBlur is set)
上级 4a31e2f7
......@@ -3,6 +3,7 @@ define(function (require) {
var Path = require('zrender/graphic/Path');
var vec2 = require('zrender/core/vector');
var fixClipWithShadow = require('zrender/graphic/helper/fixClipWithShadow');
var vec2Min = vec2.min;
var vec2Max = vec2.max;
......@@ -154,6 +155,8 @@ define(function (require) {
stroke: '#000'
},
brush: fixClipWithShadow(Path.prototype.brush),
buildPath: function (ctx, shape) {
var points = shape.points;
......@@ -206,6 +209,8 @@ define(function (require) {
connectNulls: false
},
brush: fixClipWithShadow(Path.prototype.brush),
buildPath: function (ctx, shape) {
var points = shape.points;
var stackedOnPoints = shape.stackedOnPoints;
......
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<script src="esl.js"></script>
<script src="config.js"></script>
<script src="lib/jquery.min.js"></script>
<script src="lib/facePrint.js"></script>
<script src="ut/lib/canteen.js"></script>
<script src="lib/testHelper.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="reset.css">
</head>
<body>
<style>
h1 {
line-height: 60px;
height: 60px;
background: #146402;
text-align: center;
font-weight: bold;
color: #eee;
font-size: 14px;
}
.chart {
height: 500px;
}
</style>
<canvas class="chart" id="main"></canvas>
<script>
var stack =
// -------------------------------------------------
[
{"method":"save","arguments":[]},{"method":"clearRect","arguments":[0,0,400,300]},{"method":"save","arguments":[]},{"attr":"fillStyle","val":"transparent"},{"method":"fillRect","arguments":[0,0,400,300]},{"method":"restore","arguments":[]},{"attr":"shadowBlur","val":0},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"attr":"shadowColor","val":"#000"},{"attr":"lineCap","val":"round"},{"attr":"lineJoin","val":"miter"},{"attr":"miterLimit","val":10},{"attr":"fillStyle","val":null},{"attr":"strokeStyle","val":"#333"},{"attr":"globalAlpha","val":1},{"attr":"globalCompositeOperation","val":"source-over"},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40.5,240]},{"method":"lineTo","arguments":[40.5,60]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineCap","val":"butt"},{"attr":"fillStyle","val":"#333"},{"attr":"strokeStyle","val":null},{"method":"setTransform","arguments":[1,0,0,1,40,45]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["数量",0,-6]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineCap","val":"round"},{"attr":"fillStyle","val":null},{"attr":"strokeStyle","val":"#333"},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354.5,240]},{"method":"lineTo","arguments":[354.5,60]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineCap","val":"butt"},{"attr":"fillStyle","val":"#333"},{"attr":"strokeStyle","val":null},{"method":"setTransform","arguments":[1,0,0,1,354,45]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["比例",0,-6]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"fillStyle","val":null},{"attr":"strokeStyle","val":"#333"},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40,240.5]},{"method":"lineTo","arguments":[35,240.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40,204.5]},{"method":"lineTo","arguments":[35,204.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40,168.5]},{"method":"lineTo","arguments":[35,168.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40,132.5]},{"method":"lineTo","arguments":[35,132.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40,96.5]},{"method":"lineTo","arguments":[35,96.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[40,60.5]},{"method":"lineTo","arguments":[35,60.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354,240.5]},{"method":"lineTo","arguments":[359,240.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354,204.5]},{"method":"lineTo","arguments":[359,204.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354,168.5]},{"method":"lineTo","arguments":[359,168.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354,132.5]},{"method":"lineTo","arguments":[359,132.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354,96.5]},{"method":"lineTo","arguments":[359,96.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"lineWidth","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"moveTo","arguments":[354,60.5]},{"method":"lineTo","arguments":[359,60.5]},{"method":"stroke","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"fillStyle","val":"#333"},{"attr":"strokeStyle","val":null},{"method":"setTransform","arguments":[1,0,0,1,32,240]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"right"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["0",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,32,204]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"right"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["20",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,32,168]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"right"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["40",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,32,132]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"right"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["60",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,32,96]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"right"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["80",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,32,60]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"right"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["100",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,362,240]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"left"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["0%",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,362,204]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"left"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["20%",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,362,168]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"left"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["40%",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,362,132]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"left"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["60%",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,362,96]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"left"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["80%",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"setTransform","arguments":[1,0,0,1,362,60]},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"textAlign","val":"left"},{"attr":"textBaseline","val":"middle"},{"method":"fillText","arguments":["100%",0,0]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"attr":"fillStyle","val":"#73cafd"},{"attr":"globalAlpha","val":1},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[53.857,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["28",62.857,235]},{"method":"restore","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[99.571,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["25",108.571,235]},{"method":"restore","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[145.286,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["27",154.286,235]},{"method":"restore","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[191,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["26",200,235]},{"method":"restore","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[236.714,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["33",245.714,235]},{"method":"restore","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[282.429,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["33",291.429,235]},{"method":"restore","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[328.143,240,18,0]},{"method":"closePath","arguments":[]},{"method":"fill","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"save","arguments":[]},{"attr":"textAlign","val":"center"},{"attr":"textBaseline","val":"alphabetic"},{"attr":"fillStyle","val":"#73cafd"},{"attr":"font","val":"normal normal 12px sans-serif"},{"attr":"shadowBlur","val":0},{"attr":"shadowColor","val":"transparent"},{"attr":"shadowOffsetX","val":0},{"attr":"shadowOffsetY","val":0},{"method":"fillText","arguments":["33",337.143,235]},{"method":"restore","arguments":[]},{"method":"save","arguments":[]},{"method":"setTransform","arguments":[1,0,0,1,0,0]},{"method":"beginPath","arguments":[]},{"method":"rect","arguments":[61.857,58.5,0,183]},{"method":"closePath","arguments":[]},
{"method":"clip","arguments":[]},
{"method":"setTransform","arguments":[1,0,0,1,0,0]},
{"attr":"shadowBlur","val":10},
{"attr":"shadowOffsetX","val":10},
{"attr":"shadowOffsetY","val":10},
{"attr":"shadowColor","val":"rgba(0,0,0,0.4)"},
{"attr":"lineJoin","val":"bevel"},
{"attr":"fillStyle","val":"none"},
{"attr":"strokeStyle","val":"#999"},
{"attr":"globalAlpha","val":1},
{"attr":"lineWidth","val":3},
{"method":"setTransform","arguments":[1,0,0,1,0,0]},
{"method":"beginPath","arguments":[]},
{"method":"moveTo","arguments":[62.857,92.4]},
{"method":"lineTo","arguments":[108.571,112.2]},
{"method":"lineTo","arguments":[154.286,97.8]},
{"method":"lineTo","arguments":[200,88.8]},
// {"method":"lineTo","arguments":[245.714,61.8]},
{"method":"lineTo","arguments":[245.714,81.9]},
// {"method":"lineTo","arguments":[291.429,79.8]},
// {"method":"lineTo","arguments":[337.143,79.8]},
{"method":"stroke","arguments":[]}
]
// -------------------------------------------------
function doSet(ctx, stack) {
stack.forEach(function (item, index) {
if (item.method) {
if (item.method !== 'lastFail') {
ctx[item.method].apply(ctx, item.arguments);
}
}
else if (item.attr) {
ctx[item.attr] = item.val;
}
});
}
var canvas = document.getElementById('main');
canvas.width = 400;
canvas.height = 300;
// stack = stack.slice(0, 357);
// console.log(JSON.stringify(stack.slice(0, 357)));
doSet(canvas.getContext('2d'), stack);
</script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<script src="esl.js"></script>
<script src="config.js"></script>
<script src="lib/jquery.min.js"></script>
<script src="lib/facePrint.js"></script>
<script src="ut/lib/canteen.js"></script>
<script src="lib/testHelper.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="reset.css">
</head>
<body>
<style>
h1 {
line-height: 60px;
height: 60px;
background: #146402;
text-align: center;
font-weight: bold;
color: #eee;
font-size: 14px;
}
.chart {
height: 500px;
}
</style>
<div class="chart" id="main"></div>
<textarea id="info" style="height: 600px; width: 1000px"></textarea>
<script>
var echarts;
var chart;
var myChart;
var groupCategories = [];
var groupColors = [];
require([
'echarts',
'echarts/chart/line',
'echarts/chart/bar',
'echarts/chart/pie',
'echarts/chart/scatter',
'echarts/chart/map',
'echarts/chart/parallel',
'echarts/chart/radar',
'echarts/component/grid',
'echarts/component/polar',
'echarts/component/geo',
'echarts/component/singleAxis',
'echarts/component/legend',
'echarts/component/tooltip',
'echarts/component/toolbox',
'echarts/component/visualMap',
'echarts/component/dataZoom'
], function (ec) {
echarts = ec;
var y1Max = 100;
var y2Max = 100;
var myxAxisData = ['05-11','05-12','05-13','05-14','05-15','05-16','05-17'];
var myData1 = [28,25,27,26,33,33,33];
var myData2 = [82,71,79,84,99,89,89];
option = {
title: {
text: '最近一周趋势',
textStyle: {
fontWeight: 'bold',
fontSize: 12
},
padding: [15, 0, 0, 0]
},
legend: {
data: ['数量', '比例'],
right: 0,
padding: [15, 0, 0, 0]
},
xAxis: {
data: myxAxisData,
axisLabel: {
textStyle: {
color: '#000'
}
},
axisTick: {
show: true
},
axisLine: {
show: true
},
z: 10
},
yAxis: [{
type: 'value',
name: '数量',
min: 0,
max: y1Max,
position: 'left',
splitLine: {
show: false
}
}, {
type: 'value',
name: '比例',
min: 0,
max: y2Max,
position: 'right',
axisLabel: {
formatter: '{value}%'
},
offset: -6,
splitLine: {
show: false
}
}],
series: [{
name: '数量',
type: 'bar',
barWidth: 18,
yAxisIndex: 0,
label: {
normal: {
color: '#73cafd',
show: true,
position: 'top'
}
},
itemStyle: {
normal: {
color: '#73cafd'
}
},
data: myData1
}, {
name: '比例',
type: 'line',
yAxisIndex: 1,
label: {
normal: {
textStyle: {
color: '#999',
},
show: true,
position: 'top',
formatter: '{c}%'
}
},
lineStyle: {
normal: {
color: '#999',
width: 3,
shadowColor: 'rgba(0,0,0,0.4)',
shadowBlur: 10,
shadowOffsetY: 10
}
},
data: myData2
}]
}
// var canvas = document.createElement('canvas');
// canvas.width = 600;
// canvas.height = 400;
// chart = myChart = echarts.init(canvas);
chart = myChart = echarts.init(document.getElementById('main'));
chart.setOption(option);
// var ctx = canvas.getContext('2d');
// console.log(JSON.stringify(ctx.stack()));
});
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册