blob: 7f9a13549c5a401c065dc90ff86abf792a905b51 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
import * as React from 'react';
import { StrCast } from '../../../../fields/Types';
import { NewLightboxView } from '../NewLightboxView';
import './ExploreView.scss';
import { IExploreView, emptyBounds } from './utils';
export function ExploreView(props: IExploreView) {
const { recs, bounds = emptyBounds } = props;
return (
<div className="exploreView-container">
{recs &&
recs.map(rec => {
const xBound: number = Math.max(Math.abs(bounds.max_x), Math.abs(bounds.min_x));
const yBound: number = Math.max(Math.abs(bounds.max_y), Math.abs(bounds.min_y));
if (rec.embedding) {
const x = (rec.embedding.x / xBound) * 50;
const y = (rec.embedding.y / yBound) * 50;
return (
<div key={'' + x + ' ' + y} className="exploreView-doc" onClick={() => {}} style={{ top: `calc(50% + ${y}%)`, left: `calc(50% + ${x}%)` }}>
{rec.title}
</div>
);
}
return null;
})}
<div className="exploreView-doc" style={{ top: `calc(50% + ${0}%)`, left: `calc(50% + ${0}%)`, background: '#073763', color: 'white' }}>
{StrCast(NewLightboxView.LightboxDoc?.title)}
</div>
</div>
);
}
|
