fix css layout
parent
cbe34ab4c3
commit
758551539c
|
@ -23,7 +23,8 @@ export function Renderer(store) {
|
||||||
this.raycaster = new THREE.Raycaster();
|
this.raycaster = new THREE.Raycaster();
|
||||||
|
|
||||||
window.scene = this.scene;
|
window.scene = this.scene;
|
||||||
this.scene.background = new THREE.Color(0xb0b0b0);
|
this.scene.background = new THREE.Color(0x888888);
|
||||||
|
// this.scene.background = new THREE.Color(0xffffff);
|
||||||
|
|
||||||
const helpersGroup = new THREE.Group();
|
const helpersGroup = new THREE.Group();
|
||||||
helpersGroup.name= "helpersGroup"
|
helpersGroup.name= "helpersGroup"
|
||||||
|
@ -169,20 +170,11 @@ async function addSketch() {
|
||||||
|
|
||||||
// window.sketcher = sketcher
|
// window.sketcher = sketcher
|
||||||
|
|
||||||
|
this.render()
|
||||||
this.store.dispatch({ type: 'rx-new-sketch', idx: this.scene.children.length - 1 })
|
this.store.dispatch({ type: 'rx-new-sketch', idx: this.scene.children.length - 1 })
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function down2() {
|
|
||||||
const result = []
|
|
||||||
for (let i = 0; i < 3; i++) {
|
|
||||||
const pt = await new Promise((res, rej) => {
|
|
||||||
this.canvas.addEventListener('pointermove', (e) => res(getPoint(e, this.camera)), { once: true })
|
|
||||||
})
|
|
||||||
result.push(pt)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function getPoint(e, camera) {
|
function getPoint(e, camera) {
|
||||||
|
|
|
@ -17,9 +17,12 @@ const App = () => {
|
||||||
const sketches = useSelector(state => state.sketches)
|
const sketches = useSelector(state => state.sketches)
|
||||||
|
|
||||||
return <>
|
return <>
|
||||||
|
|
||||||
|
<div className='buttons-group'>
|
||||||
<button onClick={() => dispatch({ type: 'toggle', payload: true })}> true</button>
|
<button onClick={() => dispatch({ type: 'toggle', payload: true })}> true</button>
|
||||||
<button onClick={() => dispatch({ type: 'toggle', payload: false })}> false </button>
|
<button onClick={() => dispatch({ type: 'toggle', payload: false })}> false </button>
|
||||||
<button onClick={renderInst.addSketch}> addsketch </button>
|
<button onClick={renderInst.addSketch}> addsketch </button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className='feature-tree'>
|
<div className='feature-tree'>
|
||||||
{sketches.map((e, idx) => (
|
{sketches.map((e, idx) => (
|
||||||
|
|
13
src/app.scss
13
src/app.scss
|
@ -1,10 +1,21 @@
|
||||||
|
|
||||||
#react {
|
#react {
|
||||||
position: absolute;
|
// position: absolute;
|
||||||
|
// right:0;
|
||||||
|
// bottom:0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.buttons-group {
|
||||||
|
position: absolute;
|
||||||
|
left:0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.feature-tree {
|
.feature-tree {
|
||||||
color: red;
|
color: red;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right:0;
|
right:0;
|
||||||
|
// bottom:0;
|
||||||
}
|
}
|
|
@ -14,7 +14,6 @@ export function onHover(e) {
|
||||||
const hoverPts = this.raycaster.intersectObjects(this.children)
|
const hoverPts = this.raycaster.intersectObjects(this.children)
|
||||||
|
|
||||||
let idx = []
|
let idx = []
|
||||||
console.log(hoverPts)
|
|
||||||
if (hoverPts.length) {
|
if (hoverPts.length) {
|
||||||
let minDist = Infinity;
|
let minDist = Infinity;
|
||||||
for (let i = 0; i < hoverPts.length; i++) {
|
for (let i = 0; i < hoverPts.length; i++) {
|
||||||
|
@ -30,6 +29,7 @@ export function onHover(e) {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (idx.length) {
|
if (idx.length) {
|
||||||
|
console.log(idx)
|
||||||
if (hoverPts[idx[0]].object != this.hovered[0]) {
|
if (hoverPts[idx[0]].object != this.hovered[0]) {
|
||||||
|
|
||||||
for (let x = 0; x < this.hovered.length; x++) {
|
for (let x = 0; x < this.hovered.length; x++) {
|
||||||
|
|
Loading…
Reference in New Issue