Hi, I found that if the clip: ture attribute is directly added to the drawing, the upper part will be cut, so I would like to ask if it is possible to cut only the left and right sides?
Thanks for your help.
No, but you can use insetTop to make your chart fit. Or, again, use the monotone-x curve
I’m happy to help but without seeing the code it’s just too difficult.
Sorry, this is my code.
the bin transform:
Plot.plot({
insetTop: 20,
insetBottom: 20,
height: 200,
width: 840,
// marginLeft: 85,
x: { domain: this.x },
color: { range: this.colorRange, domain: colorArr },
facet: { data: data },
marks: [
Plot.areaY(
data,
Plot.binX(
{ y2: "proportion" }, // using y2 to avoid areaY’s implicit stacking
{
clip: true,
x: "umap_x",
fill: this.colored,
fillOpacity: 0.1,
thresholds: 10,
curve: "natural",
}
)
),
Plot.ruleY([0]),
Plot.lineY(
data,
Plot.binX(
{ y: "proportion" },
{
clip: true,
x: "umap_x",
stroke: this.colored,
thresholds: 10,
// curve: "monotone-x",
curve: "natural",
}
)
),
Plot.axisX({
tickSpacing: 50,
label: null,
}),
Plot.axisY({
tickSpacing: 50,
label: null,
}),
],
});
the dot:
Plot.plot({
x: { domain: this.x },
y: { domain: this.y },
marginTop: 200,
marginLeft: 80,
marginBottom: 80,
inset: 10,
width: 900,
height: 800,
marks: [
Plot.dot(data, {
clip: true,
x: "umap_x",
y: "umap_y",
fill: this.colored,
fillOpacity: 0.7,
r: 3
})], });
color: {
legend: true,
domain: colorArr,
range: this.colorRange,
},
It’s really awkward, I know the reason. In the bin transform chart, I forgot to add inset:10.
Thank you for your help. You are so kind.