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.

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

Okay, I used insetTop and clip to adjust my chart, but I found that the position of the cut is different from the scatter plot. What is the reason for this?

I’m happy to help but without seeing the code it’s just too difficult.

1 Like

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.