cesium-react

React components for 🌏 Cesium

importReactfrom"react";import{Cartesian3}from"cesium";import{Viewer,Entity}from"cesium-react";exportdefaultclassCesiumextendsReact.PureComponent{render(){return(<Viewerfull><Entityname="tokyo"position={Cartesian3.fromDegrees(139.767052,35.681167,100)}point={{pixelSize: 10}}>
test
</Entity></Viewer>);}}

Available components:

• <Viewer>
• <CesiumWidget>
• <Scene>
• <Camera>
• <Entity>
• <CustomDataSource>
• <CzmlDataSource>
• <GeoJsonDataSource>
• <KmlDataSource>
• <Primitive>
• <PointPrimitive>
• <PointPrimitiveCollection>
• <ScreenSpaceEvent>
• <ScreenSpaceEventHandler>
• <ScreenSpaceCameraController>
• <ImageryLayer>
• ...

Documentation

Sorry, no documents now.

Please refer to storybook and examples:

git clone https://github.com/rot1024/cesium-react.git
cd cesium-react
yarn
# run dev server for examples
yarn run examples:dev
# run storybook
yarn run storybook

Getting Started

Typical env: webpack + html-webpack-plugin

npm i cesium cesium-react --save
npm i html-include-assets-plugin --save-dev

webpack.config.js:

module.exports={externals: {cesium: "Cesium"},output: {publicPath: "/"// ...},plugins: {newCopyPlugin([{from: `node_modules/cesium/Build/Cesium${prod ? "" : "Unminified"}`,to: "cesium"}]),newHtmlIncludeAssetsPlugin({append: false,assets: ["cesium/Widgets/widgets.css","cesium/Cesium.js"]}),newwebpack.DefinePlugin({"process.env": {NODE_ENV: JSON.stringify(opts&&prod ? "production" : "development"),CESIUM_BASE_URL: JSON.stringify("/cesium")}})// ...}// ...}

Cesium official way

⚠ Unconfirmed

After the article:

npm i cesium-react

module.exports={// ...alias: {cesiumSource: "cesium",cesium: "cesium/Cesium"},// ...}

Then replace as bellow:

importColorfrom"cesium/Core/Color";

to

importColorfrom"cesiumSource/Core/Color";

TODO

• Implement other components (Model, EntityCollection, ParticleSystem, Cesium3DTileset ...)
• Set up proper prop types
• More unit tests
• More documentation
• More examples

Contributing

Welcome PRs and issues.

License

MIT License