Skip to content

Commit

Permalink
fixes Histograms display without fills intermittently #292
Browse files Browse the repository at this point in the history
  • Loading branch information
paddymul committed Nov 11, 2024
1 parent 5f43d1a commit 0d4c618
Showing 1 changed file with 19 additions and 19 deletions.
38 changes: 19 additions & 19 deletions js/components/DFViewerParts/HistogramCell.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,15 @@ export const HistogramCell = (props: any) => {
console.log('dumbClickHandler', rechartsArgs);
};

const gensym = (base: string) => {
const id = `${base}-${crypto.randomUUID()}`;
return [id, `url(#${id})`];
};
const [starId, starUrl] = gensym('star');
const [stripeId, stripeUrl] = gensym('stripe');
const [circleId, circleUrl] = gensym('circle');
const [checkersId, checkersUrl] = gensym('checkers');
const [leafsId, leafsUrl] = gensym('leafs');
const [screenCoords, setScreenCoords] = React.useState<{
x: number;
y: number;
Expand All @@ -106,7 +115,7 @@ export const HistogramCell = (props: any) => {
>
<defs>
<pattern
id="star"
id={starId}
width="10"
height="10"
patternUnits="userSpaceOnUse"
Expand All @@ -117,7 +126,7 @@ export const HistogramCell = (props: any) => {
/>
</pattern>
<pattern
id="stripe"
id={stripeId}
width="4"
height="4"
patternUnits="userSpaceOnUse"
Expand All @@ -126,7 +135,7 @@ export const HistogramCell = (props: any) => {
<rect width="2" height="4" fill="red" />
</pattern>
<pattern
id="circles"
id={circleId}
width="4"
height="4"
patternUnits="userSpaceOnUse"
Expand All @@ -141,7 +150,7 @@ export const HistogramCell = (props: any) => {
</pattern>

<pattern
id="checkers"
id={checkersId}
x="0"
y="0"
width="4"
Expand All @@ -153,7 +162,7 @@ export const HistogramCell = (props: any) => {
</pattern>

<pattern
id="leafs"
id={leafsId}
x="0"
y="0"
width="6"
Expand All @@ -172,25 +181,16 @@ export const HistogramCell = (props: any) => {
<Bar dataKey="tail" stroke="#000" fill="gray" stackId="stack" />
<Bar dataKey="true" stroke="#00f" fill="#00f" stackId="stack" />
<Bar dataKey="false" stroke="#000" fill="#fff" stackId="stack" />
<Bar
dataKey="cat_pop"
stroke="pink"
fill="url(#circles)"
stackId="stack"
/>
<Bar dataKey="cat_pop" stroke="pink" fill={circleUrl} stackId="stack" />
<Bar
dataKey="unique"
stroke="#0f0"
fill="url(#checkers)"
stackId="stack"
/>
<Bar
dataKey="longtail"
stroke="teal"
fill="url(#leafs)"
fill={checkersUrl}
stackId="stack"
/>
<Bar dataKey="NA" fill="url(#stripe)" stackId="stack" />
<Bar dataKey="longtail" stroke="teal" fill={leafsUrl} stackId="stack" />
<Bar dataKey="user1" stroke="teal" fill={starUrl} stackId="stack" />
<Bar dataKey="NA" fill={stripeUrl} stackId="stack" />
<Tooltip
formatter={formatter}
allowEscapeViewBox={{ x: true, y: true }}
Expand Down

0 comments on commit 0d4c618

Please sign in to comment.