tweak: squiggle chart on link hover
This commit is contained in:
parent
a1c255b2d3
commit
265908d3c5
|
@ -24,57 +24,51 @@ const effectButtonStyle =
|
|||
"bg-transparent m-2 hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded mt-5";
|
||||
|
||||
export function DynamicSquiggleChart({ link, stopShowing }) {
|
||||
let usefulLink = {
|
||||
source: link.source,
|
||||
target: link.target,
|
||||
squiggleString: link.squiggleString,
|
||||
};
|
||||
return link == null ? (
|
||||
""
|
||||
) : (
|
||||
/*{
|
||||
<div className="grid grid-cols-1 grid-rows-1 place-items-center">
|
||||
if (link == null) {
|
||||
return "";
|
||||
} else {
|
||||
let usefulLink = {
|
||||
source: link.source,
|
||||
target: link.target,
|
||||
squiggleString: link.squiggleString,
|
||||
};
|
||||
return (
|
||||
<div className="">
|
||||
<textarea
|
||||
value={JSON.stringify(usefulLink, null, 4)}
|
||||
//onChange={handleChange}
|
||||
disabled={true}
|
||||
rows={JSON.stringify(usefulLink, null, 4).split("\n").length}
|
||||
cols={37}
|
||||
className="text-left text-gray-600 bg-white rounded text-normal p-6 border-0 shadow outline-none focus:outline-none focus:ring mb-4"
|
||||
/>
|
||||
<SquiggleChart
|
||||
squiggleString={link.squiggleString}
|
||||
width={445}
|
||||
height={200}
|
||||
showSummary={true}
|
||||
showTypes={true}
|
||||
/>
|
||||
{/*
|
||||
SquiggleChart props:
|
||||
squiggleString?: string;
|
||||
sampleCount?: number;
|
||||
environment?: environment;
|
||||
chartSettings?: FunctionChartSettings;
|
||||
onChange?(expr: squiggleExpression): void;
|
||||
width?: number;
|
||||
height?: number;
|
||||
bindings?: bindings;
|
||||
jsImports?: jsImports;
|
||||
showSummary?: boolean;
|
||||
showTypes?: boolean;
|
||||
showControls?: boolean;
|
||||
*/}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
}*/
|
||||
<div className="">
|
||||
<textarea
|
||||
value={JSON.stringify(usefulLink, null, 4)}
|
||||
//onChange={handleChange}
|
||||
disabled={true}
|
||||
rows={JSON.stringify(usefulLink, null, 4).split("\n").length}
|
||||
cols={37}
|
||||
className="text-left text-gray-600 bg-white rounded text-normal p-6 border-0 shadow outline-none focus:outline-none focus:ring mb-4"
|
||||
/>
|
||||
<SquiggleChart
|
||||
squiggleString={link.squiggleString}
|
||||
width={445}
|
||||
height={200}
|
||||
showSummary={true}
|
||||
showTypes={true}
|
||||
/>
|
||||
<button className={effectButtonStyle} onClick={() => stopShowing()}>
|
||||
Hide chart
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
{
|
||||
/*
|
||||
SquiggleChart props:
|
||||
squiggleString?: string;
|
||||
sampleCount?: number;
|
||||
environment?: environment;
|
||||
chartSettings?: FunctionChartSettings;
|
||||
onChange?(expr: squiggleExpression): void;
|
||||
width?: number;
|
||||
height?: number;
|
||||
bindings?: bindings;
|
||||
jsImports?: jsImports;
|
||||
showSummary?: boolean;
|
||||
showTypes?: boolean;
|
||||
showControls?: boolean;
|
||||
*/
|
||||
<button className={effectButtonStyle} onClick={() => stopShowing()}>
|
||||
Hide chart
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
BIN
packages/webpage-refactor/public/example-graph-and-squiggle.png
Normal file
BIN
packages/webpage-refactor/public/example-graph-and-squiggle.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 231 KiB |
Loading…
Reference in New Issue
Block a user