Question

使用flotchart.org，我想替换默认的＆＃39;圈＆＃39;形状代表一个点，只有一个相似的圆圈，但充满了系列的颜色;例如，用颜色＆＃34;红色＆＃34;与某个系列相关联：我想表示的符号是，使用HTML5 canvas API：

var ctx=c.getContext("2d");ctx.beginPath(); ctx.arc(100,75,3,0,2*Math.PI); ctx.fillStyle="red"; ctx.fill();

但我无法获得结果，编码flotchart documentation建议的内容。

正如上面文档中所建议的，在我编写自定义函数的选项中：

          points: {
            show: true,
            radius: 2,
            symbol: 
                function fullCircle(ctx, x, y, radius, shadow) {        
                    ctx.arc(x, y, radius, 0, shadow ? Math.PI : Math.PI * 2, false);
                    ctx.fill();
                },

ctx.fill不能正常工作：圆圈用黑色填充，刚刚指向后，我想用相应系列的颜色填充圆圈，然后聚焦点...... / p> 抱歉我对canvas ctx的无知......

Answer 1

有一组flot设置可以绘制实心圆（圆盘）来表示系列点引自文档https://github.com/flot/flot/blob/master/API.md

“填充”是指应填充形状。对于线条，这会产生面积图。您可以使用“fillColor”指定填充的颜色。 如果“fillColor”评估为false （除了以外的所有内容的默认值）填充白色的点，填充颜色自动设置为数据系列的颜色。您可以调整填充的不透明度 将“填充”设置为0（完全透明）和1（完全透明）之间的数字不透明）

所以你只需将series.points.fillColor选项设置为false（使用系列颜色，或任何你喜欢的颜色）。并且series.points.fill到1表示完全不透明。只是玩弄小提琴。

这是JsFiddle。

flotchart.org：如何绘制带圆圈的散点图作为符号？

1 个答案: