Flot:无法去除点阴影
Flot: Impossible to remove point shadow
当我使用 javascript flot 库绘制不同大小和颜色的点时,我无法去除阴影。
$(function () {
var d2 = [[0, 0], [1, 1], [2, 2], [3, 3],[4, 4], [5, 5], [6, 6], [7, 7],[8, 8], [9, 9], [10, 10], [11, 11]];
var colors = ["#cc4444", "#ff0000", "#0000ff", "#00ff00"];
var radius = [1, 2, 3, 4,5,6,7,8,9,10,11,12];
var rainbow = new Rainbow();
rainbow.setSpectrum('blue','green', 'yellow','red');
rainbow.setNumberRange(1, 12);
function raw(plot, ctx) {
var data = plot.getData();
var axes = plot.getAxes();
var offset = plot.getPlotOffset();
for (var i = 0; i < data.length; i++) {
var series = data[i];
for (var j = 0; j < series.data.length; j++) {
var color = colors[j];
var d = (series.data[j]);
var x = offset.left + axes.xaxis.p2c(d[0]);
var y = offset.top + axes.yaxis.p2c(d[1]);
var r = radius[j];
ctx.lineWidth = 0;
ctx.shadowSize=0;
ctx.beginPath();
ctx.arc(x,y,r,0,Math.PI*2,true);
ctx.closePath();
ctx.fillStyle = "#"+rainbow.colourAt(r);
ctx.fill();
}
}
};
var plot = $.plot(
$("#placeholder"),
[{ data: d2, points: { show: true ,shadowSize:0,lineWidth: 0}}],
{ hooks: { draw : [raw] }}
);
});
我尝试设置不同的 shadowSize,但当 lineWidth 正常工作时它不起作用。
有什么想法吗?
shadowSize
不是 points
对象的 属性。
您需要在 series
对象中指定 shadowSize
:
[{
data: d2,
points:
{
show: true,
lineWidth: 0
},
shadowSize: 0
}]
当我使用 javascript flot 库绘制不同大小和颜色的点时,我无法去除阴影。
$(function () {
var d2 = [[0, 0], [1, 1], [2, 2], [3, 3],[4, 4], [5, 5], [6, 6], [7, 7],[8, 8], [9, 9], [10, 10], [11, 11]];
var colors = ["#cc4444", "#ff0000", "#0000ff", "#00ff00"];
var radius = [1, 2, 3, 4,5,6,7,8,9,10,11,12];
var rainbow = new Rainbow();
rainbow.setSpectrum('blue','green', 'yellow','red');
rainbow.setNumberRange(1, 12);
function raw(plot, ctx) {
var data = plot.getData();
var axes = plot.getAxes();
var offset = plot.getPlotOffset();
for (var i = 0; i < data.length; i++) {
var series = data[i];
for (var j = 0; j < series.data.length; j++) {
var color = colors[j];
var d = (series.data[j]);
var x = offset.left + axes.xaxis.p2c(d[0]);
var y = offset.top + axes.yaxis.p2c(d[1]);
var r = radius[j];
ctx.lineWidth = 0;
ctx.shadowSize=0;
ctx.beginPath();
ctx.arc(x,y,r,0,Math.PI*2,true);
ctx.closePath();
ctx.fillStyle = "#"+rainbow.colourAt(r);
ctx.fill();
}
}
};
var plot = $.plot(
$("#placeholder"),
[{ data: d2, points: { show: true ,shadowSize:0,lineWidth: 0}}],
{ hooks: { draw : [raw] }}
);
});
我尝试设置不同的 shadowSize,但当 lineWidth 正常工作时它不起作用。
有什么想法吗?
shadowSize
不是 points
对象的 属性。
您需要在 series
对象中指定 shadowSize
:
[{
data: d2,
points:
{
show: true,
lineWidth: 0
},
shadowSize: 0
}]