blob: 855bfd9e2dd3e7c8d6b06469e23735c50936d4e1 (
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
|
import './ExploreView.scss';
import { IBounds, IExploreView, emptyBounds } from "./utils";
import { IRecommendation } from "../components";
import * as React from 'react';
import { NewLightboxView } from '../NewLightboxView';
import { StrCast } from '../../../../fields/Types';
export const ExploreView = (props: IExploreView) => {
const { recs, bounds=emptyBounds } = props
return <div className={`exploreView-container`}>
{recs && recs.map((rec) => {
console.log(rec.embedding, bounds)
const x_bound: number = Math.max(Math.abs(bounds.max_x), Math.abs(bounds.min_x))
const y_bound: number = Math.max(Math.abs(bounds.max_y), Math.abs(bounds.min_y))
console.log(x_bound, y_bound)
if (rec.embedding) {
const x = (rec.embedding.x / x_bound) * 50;
const y = (rec.embedding.y / y_bound) * 50;
console.log(x, y)
return <div className={`exploreView-doc`} onClick={() => {}} style={{top: `calc(50% + ${y}%)`, left: `calc(50% + ${x}%)`}}>
{rec.title}
</div>
} else return (null)
})}
<div className={`exploreView-doc`} style={{top: `calc(50% + ${0}%)`, left: `calc(50% + ${0}%)`, background: '#073763', color: 'white'}}>{StrCast(NewLightboxView.NewLightboxDoc?.title)}</div>
</div>
}
|
