xsh-react-three

react three 3d webgl

Usage no npm install needed!

<script type="module">
  import xshReactThree from 'https://cdn.skypack.dev/xsh-react-three';
</script>

README

文档编写中

技术栈 react three typescript
仓库地址: https://gitee.com/drm/xsh-react-three

xsh-react-three
xsh-react-three-ui
xsh-react-three-chart

import { AxesHelper, Camera, Group3D, OrbitControls, Plane, Renderer, SkyBox, Text2D } from "xsh-react-three";

<Renderer dev={true}>

    <OrbitControls
        initTime={0}
        position={{ x: 10, y: 10, z: 10 }}
        center={{x: 1, y: 0, z: 0}}
        enableDamping={true}
    >
        <Camera />

    </OrbitControls>

    <SkyBox />

    <AxesHelper />

    <Group3D
      position={{ y: 2 }}
    >
      <Plane
        title={<span>button</span>}
        map={undefined}// imgUrl
        position={{}}
        rotation={{ z: Math.PI / -2 }}
        scale={{ x: 0.6, y: 2 }}
        cursor="pointer"
        onClick={e => { }}
      />

      <Text2D
        size={0.5}
        text="button"
        position={{ z: 0.05 }}
        textAlign="center_center"
      />

      <Text2D
        size={0.5}
        text="button"
        position={{ z: -0.05 }}
        rotation={{ y: Math.PI }}
        textAlign="center_center"
      />
    </Group3D>

</Renderer>