Skip to content

Commit

Permalink
feat: add mapbox+deck.gl basic map
Browse files Browse the repository at this point in the history
  • Loading branch information
eng-cc committed Jul 19, 2023
1 parent caf3821 commit b725c60
Show file tree
Hide file tree
Showing 32 changed files with 3,698 additions and 117 deletions.
3 changes: 3 additions & 0 deletions .github/workflows/codeql.yml
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,9 @@ jobs:
steps:
- name: Checkout repository
uses: actions/checkout@v3
with:
submodules: recursive
ssh-key: "ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQDkAa2Y049BCOYn0m2IINqBTjO18HtiOia4QRDkmClCy4/fQLcPsmQ7C7cE3TDGFNbIcm17jl3wQXCd8y1SBi6iWhcHXskI+HCtzN/NASBstljcuhx6gll3xjFhWj2XN2zwmpLzOVsCj7K34N8FRmEaPcrB3D0pKg89qO3SCPETFAwuzLFWsPzXWtDL6O90qbO1AGg2vQrucRvvIiQ2IOg8eMidXszgVi8kanfuh4zVRn+NINpNZMYFabkj6HfbGX9QyRyOS2cznKCG8MXIbIJiK9jTR0Yd0/WaUHRk69fBB0p5zhhVsrMvBAM/RjLKg1ePgJctYPTFPJMc59/MwCB3 cc_ga"

# Initializes the CodeQL tools for scanning.
- name: Initialize CodeQL
Expand Down
3 changes: 3 additions & 0 deletions .github/workflows/deploy_doc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,9 @@ jobs:
steps:
- name: Checkout your repository using git
uses: actions/checkout@v3
with:
submodules: recursive
ssh-key: "ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQDkAa2Y049BCOYn0m2IINqBTjO18HtiOia4QRDkmClCy4/fQLcPsmQ7C7cE3TDGFNbIcm17jl3wQXCd8y1SBi6iWhcHXskI+HCtzN/NASBstljcuhx6gll3xjFhWj2XN2zwmpLzOVsCj7K34N8FRmEaPcrB3D0pKg89qO3SCPETFAwuzLFWsPzXWtDL6O90qbO1AGg2vQrucRvvIiQ2IOg8eMidXszgVi8kanfuh4zVRn+NINpNZMYFabkj6HfbGX9QyRyOS2cznKCG8MXIbIJiK9jTR0Yd0/WaUHRk69fBB0p5zhhVsrMvBAM/RjLKg1ePgJctYPTFPJMc59/MwCB3 cc_ga"
- name: Install, build, and upload your site
uses: withastro/action@v0
with:
Expand Down
12 changes: 10 additions & 2 deletions .github/workflows/main.yml
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,11 @@ jobs:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3

- uses: LuisEnMarroquin/[email protected]
with:
SSHKEY: ${{ secrets.CC_GA }} # ----- BEGIN RSA PRIVATE KEY----- ...
- run: ssh -T [email protected] || true
- run: git submodule update --init --recursive
- name: Install pnpm
uses: pnpm/[email protected]

Expand All @@ -32,7 +36,11 @@ jobs:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3

- uses: LuisEnMarroquin/[email protected]
with:
SSHKEY: ${{ secrets.CC_GA }} # ----- BEGIN RSA PRIVATE KEY----- ...
- run: ssh -T [email protected] || true
- run: git submodule update --init --recursive
- name: Install pnpm
uses: pnpm/[email protected]

Expand Down
11 changes: 11 additions & 0 deletions .github/workflows/playwright.yml
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,10 @@ jobs:
timeout-minutes: 60
runs-on: ubuntu-latest
steps:
- uses: LuisEnMarroquin/[email protected]
with:
SSHKEY: ${{ secrets.CC_GA }} # ----- BEGIN RSA PRIVATE KEY----- ...
- run: ssh -T [email protected] || true
- uses: actions/checkout@v3
- name: Install pnpm
uses: pnpm/[email protected]
Expand Down Expand Up @@ -40,7 +44,14 @@ jobs:
timeout-minutes: 60
runs-on: ubuntu-latest
steps:
- uses: LuisEnMarroquin/[email protected]
with:
SSHKEY: ${{ secrets.CC_GA }} # ----- BEGIN RSA PRIVATE KEY----- ...
- run: ssh -T [email protected] || true
- uses: actions/checkout@v3
with:
submodules: recursive
ssh-key: "ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQDkAa2Y049BCOYn0m2IINqBTjO18HtiOia4QRDkmClCy4/fQLcPsmQ7C7cE3TDGFNbIcm17jl3wQXCd8y1SBi6iWhcHXskI+HCtzN/NASBstljcuhx6gll3xjFhWj2XN2zwmpLzOVsCj7K34N8FRmEaPcrB3D0pKg89qO3SCPETFAwuzLFWsPzXWtDL6O90qbO1AGg2vQrucRvvIiQ2IOg8eMidXszgVi8kanfuh4zVRn+NINpNZMYFabkj6HfbGX9QyRyOS2cznKCG8MXIbIJiK9jTR0Yd0/WaUHRk69fBB0p5zhhVsrMvBAM/RjLKg1ePgJctYPTFPJMc59/MwCB3 cc_ga"
- name: Install pnpm
uses: pnpm/[email protected]

Expand Down
4 changes: 4 additions & 0 deletions .gitmodules
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
[submodule "packages/skboa"]
path = packages/skvm/skboa
url = [email protected]:chain-web/boa.git

[submodule "configs"]
path = packages/private_configs
url = [email protected]:chain-web/private_configs.git
52 changes: 52 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,58 @@
"dependencies": {
"it-drain": "*"
}
},
"@deck.gl/mapbox": {
"dependencies": {
"@math.gl/web-mercator": "*"
}
},
"@loaders.gl/3d-tiles": {
"dependencies": {
"@math.gl/culling": "*",
"@babel/runtime": "*"
}
},
"@deck.gl/layers": {
"dependencies": {
"@luma.gl/core": "*"
}
},
"@deck.gl+geo/layers": {
"dependencies": {
"@deck.gl/mesh-layers": "*"
}
},
"@loaders.gl/gltf": {
"dependencies": {
"@babel/runtime": "*"
}
},
"@loaders.gl/schema": {
"dependencies": {
"@babel/runtime": "*"
}
},
"@loaders.gl/tiles": {
"dependencies": {
"@babel/runtime": "*"
}
},
"@loaders.gl/mvt": {
"dependencies": {
"@babel/runtime": "*"
}
},
"@deck.gl/mesh-layers": {
"dependencies": {
"@luma.gl/webgl": "*",
"@loaders.gl/schema": "*"
}
},
"@math.gl/polygon": {
"dependencies": {
"@babel/runtime": "*"
}
}
}
},
Expand Down
4 changes: 4 additions & 0 deletions packages/common/config.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
type PrivateConfigs = {
mapboxToken: string;
mapboxStyle: string;
};
4 changes: 4 additions & 0 deletions packages/common/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,10 @@
"engines": {
"node": ">=16.0.0"
},
"files": [
"dist",
"src"
],
"type": "module",
"keywords": [],
"author": "",
Expand Down
5 changes: 5 additions & 0 deletions packages/common/src/index.mts
Original file line number Diff line number Diff line change
Expand Up @@ -12,3 +12,8 @@ export type {
SerdeJsValueTypes,
SerdeJsObjectType,
} from './serde/serdeJs/interface.mjs';

export type PrivateConfigs = {
mapboxToken: string;
mapboxStyle: string;
};
13 changes: 13 additions & 0 deletions packages/docs/src/content/docs/zh-cn/dev_log/202307.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
---
title: 'Dev Log 2023-07'
description: ''
---

### 7-10~7-14

- [x] 创建了 land app 工程,用来做地图游戏开发
- [x] 用私有的 repo: private_configs 来存储私有的配置文件,比如 mapbox token
- [x] 加入 mapbox + deck.gl + h3-js 的格子地图
- [x] 调研、学习 deck.gl [怎么结合 mapbox 使用](https://deck.gl/docs/get-started/using-with-map)
- [x] 最开始想用 deck.gl 的 HexagonLayer 来实现大量格子渲染,但是发现这个 layer 不太灵活,最后选择了用 polygon Layer + h3-js 来实现(从 HexagonLayer 精简而来),最终只用来测试,还没实际用起来
- [x] 用 mapboxOverlay + deck.gl 来实现了地图上添加 deck.gl 的图层,最终选用了这个方案
22 changes: 22 additions & 0 deletions packages/land_app/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,29 +14,51 @@
"node": ">=16.0.0"
},
"dependencies": {
"@deck.gl/core": "^8.9.21",
"@deck.gl/extensions": "^8.9.21",
"@deck.gl/geo-layers": "^8.9.21",
"@deck.gl/layers": "^8.9.21",
"@deck.gl/mapbox": "^8.9.21",
"@deck.gl/mesh-layers": "^8.9.21",
"@esbuild-plugins/node-globals-polyfill": "^0.2.3",
"@loaders.gl/core": "^3.4.7",
"@loaders.gl/gltf": "^3.4.7",
"@loaders.gl/images": "^3.4.7",
"@luma.gl/constants": "^8.5.20",
"@luma.gl/core": "^8.5.20",
"@luma.gl/engine": "^8.5.20",
"@luma.gl/gltools": "^8.5.20",
"@luma.gl/shadertools": "^8.5.20",
"@luma.gl/webgl": "^8.5.20",
"@math.gl/core": "^3.6.3",
"@math.gl/web-mercator": "^3.6.3",
"@trustack/common": "workspace:^1.0.0",
"@trustack/node-modules-polyfill": "^0.2.5",
"@trustack/rollup-plugin-node-polyfills": "^0.2.2",
"@xstate/react": "^3.2.2",
"antd": "^5.6.4",
"buffer": "^6.0.3",
"esbuild": "^0.17.19",
"gl-matrix": "^3.4.3",
"h3-js": "^4.1.0",
"i18next": "^22.5.1",
"i18next-browser-languagedetector": "^7.1.0",
"mapbox-gl": "^2.15.0",
"mime-types": "^2.1.35",
"multiformats": "^11.0.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-i18next": "^12.3.1",
"react-router": "^6.14.1",
"react-router-dom": "^6.14.1",
"search-insights": "^2.7.0",
"skchain": "workspace:^1.0.0",
"xstate": "^4.38.0"
},
"devDependencies": {
"@playwright/test": "^1.35.1",
"@rollup/plugin-inject": "^5.0.3",
"@types/mapbox-gl": "^2.7.11",
"@types/react": "^18.2.14",
"@types/react-dom": "^18.2.6",
"@vitejs/plugin-react-swc": "^3.3.2",
Expand Down
10 changes: 6 additions & 4 deletions packages/land_app/src/App.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
#root {
max-width: 1280px;
margin: 0 auto;
padding: 2rem;
text-align: center;
width: 100%;
height: 100%;
}

.mapboxgl-ctrl-bottom-right {
display: none;
}

.logo {
Expand Down
10 changes: 10 additions & 0 deletions packages/land_app/src/chain/skchain.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { SKChain } from 'skchain';

const createChain = () => {
const chain = new SKChain();
return chain;
};

export const chain = createChain();

export const chainState = chain.chainState;
11 changes: 10 additions & 1 deletion packages/land_app/src/main.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
import React from 'react';
import { ConfigProvider, theme } from 'antd';
import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import 'mapbox-gl/dist/mapbox-gl.css';
import 'antd/dist/reset.css';
import './polyfill';
import App from './App';
import './index.css';
Expand All @@ -14,7 +17,13 @@ import './index.css';
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
<React.StrictMode>
<BrowserRouter>
<App />
<ConfigProvider
theme={{
algorithm: theme.darkAlgorithm,
}}
>
<App />
</ConfigProvider>
</BrowserRouter>
</React.StrictMode>,
);
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
.tabbar-box {
.ant-tabs-nav {
margin-top: 0px;
padding: 10px 36px;
}
.tabbar-item-box {
height: calc(100vh - 80px);
position: relative;
overflow: hidden;
}
}

#map-container {
width: 100%;
height: 100%;
}
88 changes: 88 additions & 0 deletions packages/land_app/src/pages/mainWindow/components/Tabbar/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
import { Button, Modal, Tabs } from 'antd';
import { useActor } from '@xstate/react';
import { useState } from 'react';
// import GridDrawer from '../GridDrawer';
import './index.scss';
// import { Contract as CtrClass } from '../../contract/index';
// import CtrCode from '../../contract/index.contract';
// import { DeployContract } from '../../../test/components/contract/DeployContract';
// import { TestContract } from '../../../test/components/contract/TestContract';
// import { contractAddressKey } from '../../contract/mapContract';
import { chainState } from '../../../../chain/skchain';

const TabPane = Tabs.TabPane; // TODO use item config
// const DeployContractComp = DeployContract(CtrClass, CtrCode);
// const TestContractComp = TestContract(CtrClass, CtrCode);
export default function Tabbar() {
const [showNodeModal, setshowNodeModal] = useState(true);
return (
<div className="tabbar-box">
<Tabs tabPosition={'bottom'} defaultActiveKey="home">
<TabPane forceRender tab="home" key="home" className="tabbar-item-box">
{/* <Button
onClick={async () => {
const data = mapDb.trans.toArray();
console.log(data);
}}
>
getMapDb
</Button> */}
{/* <Button
onClick={async () => {
const data = await mapDb.trans
.where('ts')
.below(Date.now())
.delete();
console.log('delete', data);
}}
>
clear mapDb.trans
</Button> */}
{/* <Button
onClick={() => {
setshowNodeModal(true);
}}
style={{ float: 'right' }}
>
node
</Button> */}
<div
style={{
visibility: chainState.started ? 'visible' : 'hidden',
}}
id="map-container"
/>
{/* <GridDrawer /> */}
{/* <Modal
visible={showNodeModal}
onCancel={() => {
setshowNodeModal(false);
}}
style={{ top: 0 }}
maskClosable={false}
footer={null}
>
<DeployContractComp
onSuccess={(trans) => {
localStorage.setItem(contractAddressKey, trans.recipient.did);
}}
/>
<TestContractComp />
</Modal> */}
</TabPane>
{/* <TabPane
forceRender
style={{ overflow: 'auto' }}
className="tabbar-item-box"
tab="node"
key="node"
>
</TabPane> */}
<TabPane forceRender className="tabbar-item-box" tab="mine" key="mine">
mine
</TabPane>
</Tabs>
</div>
);
}
Loading

0 comments on commit b725c60

Please sign in to comment.