ui: fix sankey crash, fix journey startpoint size
This commit is contained in:
parent
6af9f719c8
commit
83f8b67f74
2 changed files with 18 additions and 21 deletions
|
|
@ -39,26 +39,10 @@ const EChartsSankey: React.FC<Props> = (props) => {
|
||||||
const { data, height = 240, onChartClick, isUngrouped } = props;
|
const { data, height = 240, onChartClick, isUngrouped } = props;
|
||||||
const chartRef = React.useRef<HTMLDivElement>(null);
|
const chartRef = React.useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
if (data.nodes.length === 0 || data.links.length === 0) {
|
|
||||||
return (
|
|
||||||
<NoContent
|
|
||||||
style={{ minHeight: height }}
|
|
||||||
title={
|
|
||||||
<div className="flex items-center relative">
|
|
||||||
<InfoCircleOutlined className="hidden md:inline-block mr-1" />
|
|
||||||
Set a start or end point to visualize the journey. If set, try
|
|
||||||
adjusting filters.
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
show={true}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const [finalNodeCount, setFinalNodeCount] = React.useState(data.nodes.length);
|
const [finalNodeCount, setFinalNodeCount] = React.useState(data.nodes.length);
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (!chartRef.current) return;
|
if (!chartRef.current || data.nodes.length === 0 || data.links.length === 0) return;
|
||||||
|
|
||||||
let finalNodes = data.nodes;
|
let finalNodes = data.nodes;
|
||||||
let finalLinks = data.links;
|
let finalLinks = data.links;
|
||||||
|
|
@ -440,6 +424,21 @@ const EChartsSankey: React.FC<Props> = (props) => {
|
||||||
};
|
};
|
||||||
}, [data, height, onChartClick]);
|
}, [data, height, onChartClick]);
|
||||||
|
|
||||||
|
if (data.nodes.length === 0 || data.links.length === 0) {
|
||||||
|
return (
|
||||||
|
<NoContent
|
||||||
|
style={{ minHeight: height }}
|
||||||
|
title={
|
||||||
|
<div className="flex items-center relative">
|
||||||
|
<InfoCircleOutlined className="hidden md:inline-block mr-1" />
|
||||||
|
Set a start or end point to visualize the journey. If set, try
|
||||||
|
adjusting filters.
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
show={true}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
let containerStyle: React.CSSProperties;
|
let containerStyle: React.CSSProperties;
|
||||||
if (isUngrouped) {
|
if (isUngrouped) {
|
||||||
const dynamicMinHeight = finalNodeCount * 15;
|
const dynamicMinHeight = finalNodeCount * 15;
|
||||||
|
|
|
||||||
|
|
@ -207,7 +207,7 @@ const PathAnalysisFilter = observer(({ metric, writeOption }: any) => {
|
||||||
<span className="font-medium">Journeys With </span>
|
<span className="font-medium">Journeys With </span>
|
||||||
<div className="flex gap-2 items-center">
|
<div className="flex gap-2 items-center">
|
||||||
<Select
|
<Select
|
||||||
className="w-36 rounded-lg !h-[26px]"
|
className="w-36 rounded-lg"
|
||||||
name="startType"
|
name="startType"
|
||||||
options={[
|
options={[
|
||||||
{ value: 'start', label: 'Start Point' },
|
{ value: 'start', label: 'Start Point' },
|
||||||
|
|
@ -216,21 +216,19 @@ const PathAnalysisFilter = observer(({ metric, writeOption }: any) => {
|
||||||
defaultValue={metric.startType || 'start'}
|
defaultValue={metric.startType || 'start'}
|
||||||
onChange={onPointChange}
|
onChange={onPointChange}
|
||||||
placeholder="Select Start Type"
|
placeholder="Select Start Type"
|
||||||
size="small"
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<span className="">showing</span>
|
<span className="">showing</span>
|
||||||
|
|
||||||
<Select
|
<Select
|
||||||
mode="multiple"
|
mode="multiple"
|
||||||
className="rounded-lg h-[26px] w-max min-w-44 max-w-58"
|
className="rounded-lg w-max min-w-44 max-w-58"
|
||||||
allowClear
|
allowClear
|
||||||
name="metricValue"
|
name="metricValue"
|
||||||
options={metricValueOptions}
|
options={metricValueOptions}
|
||||||
value={metric.metricValue || []}
|
value={metric.metricValue || []}
|
||||||
onChange={(value) => writeOption({ name: 'metricValue', value })}
|
onChange={(value) => writeOption({ name: 'metricValue', value })}
|
||||||
placeholder="Select Metrics"
|
placeholder="Select Metrics"
|
||||||
size="small"
|
|
||||||
maxTagCount={'responsive'}
|
maxTagCount={'responsive'}
|
||||||
showSearch={false}
|
showSearch={false}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue