Javascript d3js和画布：将Alpha设置为低于0.01

这可能是一个愚蠢的问题，或者是一个愚蠢的方法论，我愿意接受对这些和其他任何东西的批评

我用d3js和Canvas绘制了很多线条，我想突出那些线条密集的区域。我目前正在使用以下strokeStyle绘制线条：

ctx.strokeStyle = "rgba(" + myFill.r + "," + myFill.g + "," + myFill.b + ",0.01)";

但我的问题是，这个不透明度还不够低，我需要降低一些，因为密度稍低的区域与密度很高的区域太相似了

我试着跳出框框思考，但我正在努力思考我能做些什么。如果我将笔划的alpha设置为任何低于0.01的值，那么我将一无所获

我有没有遗漏什么，或者你有没有其他的想法

尽管我还不确定执行情况（基本上，不确定什么是可能的！！！！），但就选项而言，我脑子里有什么：

完成后对画布进行后期处理，在像素上循环并将像素的alpha值设置为不同的比例，或者根据输入颜色更改像素的颜色

将一条线与所有其他线混合的技术

绘制图像后，根据密度改变线条部分颜色的方法

对不起，如果这是愚蠢的，我有一些东西，看起来很好，但想让它看起来更好，真正显示之间的对比非常密集和密集，例如。我的泳姿是否很好，也许可以改进或改变？我知道画布很难画出很低的alpha值的东西，但我有没有办法鼓励它去尝试

---

欢迎提出任何想法和意见，谢谢您的时间

据我所知，在画布上渲染任何内容时，颜色最终由一个具有四字节（

0

到

255

）值的像素表示。例如，红色：

[255, 0, 0, 255]

定义

rgba（）

颜色时，您可以在

0

和

1

之间定义透明度。（别问我为什么，我在这个话题上的所有知识都是纯粹从玩画布材料中获得的…）我猜画布上可见的最小alpha差异是：

1/255=0.0039

基本上：

rgba(0, 0, 0, 0.0039) -> [0, 0, 0, 0]
rgba(0, 0, 0, 0,0040) -> [0, 0, 0, 1]

这意味着任何小于1/255的alpha差都不会以不同方式渲染，并且任何alpha小于1/255的填充都不会显示

不过，可能需要对此进行测试才能绝对确定

编辑：一个测试

var createCanvas=函数（alpha）{
var cvs=document.createElement（“画布”）；
cvs.width=cvs.height=100；
var ctx=cvs.getContext（“2d”）；
ctx.fillStyle=“rgba（0,0,0，“+alpha+””）；
对于（变量i=0；i<255；i+=1）{
ctx.fillRect（0，0，cvs.width，cvs.height）
}
文件.正文.附件（cvs）；
}
createCanvas（0.0039）；//应透明并显示白色
createCanvas（0.0040）；//不应完全为白色

---

canvas{border:1px纯红；}

谢谢，这很有意义。所以也许我需要更聪明一点来找到一个符合我想要的解决方案，而不是希望我能得到更低的阿尔法。我可能会做的是对图像进行后处理以获取RGB值，如果它们符合某些标准，则使其更亮或微妙地改变颜色或其他东西。只需使用图像数据进行排序。我会把这个打开，以防其他人在此期间提出创意，谢谢！！！我明白我的回答并没有真正提供解决方案；更重要的是它为什么会发生。我很好奇其他人也会想出什么主意！我猜您最好的选择是开始改变

r

、

g

、和

b

值。。。