# DC-SDK
[**🇨🇳 䏿–‡**](./README_zh.md) | [**🇬🇧English**](./README.md) **_`DC-SDK`_** is based on the open source project **_`Cesium`_** for the second development of two three-dimensional **_`WebGis`_** application framework , the framework optimizes the use of **_`Cesium`_** and adds some additional features , designed for developers to quickly build **_`WebGis`_** application. ```warning Tips:This SDK is JS+GIS framework package. Developers need to have some front-end technology and GIS related technology ``` ## Installation `NPM / YARN` **_`(Recommend)`_** Installing with NPM or YARN is recommended and it works seamlessly with webpack. ```shell yarn add @dvgis/dc-sdk ------------------------- npm install @dvgis/dc-sdk ``` ```js import DC from '@dvgis/dc-sdk/dist/dc.base.min' import DcCore from '@dvgis/dc-sdk/dist/dc.core.min' import DcChart from '@dvgis/dc-sdk/dist/dc.chart.min' import DcMapv from '@dvgis/dc-sdk/dist/dc.mapv.min' import '@dvgis/dc-sdk/dist/dc.core.min.css' ``` `NPM / YARN` **_`(On-demand)`_** ```shell yarn add @dvgis/dc-base yarn add @dvgis/dc-core yarn add @dvgis/dc-chart yarn add @dvgis/dc-mapv ------------------------- npm install @dvgis/dc-base npm install @dvgis/dc-core npm install @dvgis/dc-chart npm install @dvgis/dc-mapv ``` ```js import DC from '@dvgis/dc-base' import DcCore from '@dvgis/dc-core' import DcChart from '@dvgis/dc-chart' import DcMapv from '@dvgis/dc-mapv' import '@dvgis/dc-core/dist/dc.core.min.css' ``` `CDN` [Resources](https://github.com/dvgis/dc-sdk/releases) ```html ``` ``` Please put the resources in the project root directory libs/dc-sdk, if you put it in other directory, the framework will not run properly. ``` ## Configuration > The configuration is mainly used in the `NPM / YARN` way Since the DC framework sets `CESIUM_BASE_URL` to `JSON.stringify('. /libs/dc-sdk/resources/')`, you need to copy `Cesium` static resource files: `Assets`, `Workers`, `ThirdParty` to the `libs/dc-sdk/resources` directory of the project to ensure that the 3D scene can be rendered properly. `Webpack` [Project Template](https://github.com/cavencj/dc-vue-app) ```js // webpack.config.js const path = require('path') const CopywebpackPlugin = require('copy-webpack-plugin') const dvgisDist = './node_modules/@dvgis' module.exports = { plugins: [ new CopyWebpackPlugin([ { from: path.join(dvgisDist, 'dc-sdk/dist/resources'), to: 'libs/dc-sdk/resources', }, ]), ], } ``` `Vue2.x` [Project Template](https://github.com/dvgis/dc-vue) ```js // vue.config.js const path = require('path') const CopywebpackPlugin = require('copy-webpack-plugin') const dvgisDist = './node_modules/@dvgis' module.exports = { chainWebpack: (config) => { config.plugin('copy').use(CopywebpackPlugin, [ [ { from: path.join(dvgisDist, 'dc-sdk/dist/resources'), to: 'libs/dc-sdk/resources', }, ], ]) }, } ``` `Vue3.x` [Project Template](https://github.com/dvgis/dc-vue-next) ```js // vue.config.js const path = require('path') const CopywebpackPlugin = require('copy-webpack-plugin') const dvgisDist = './node_modules/@dvgis' module.exports = { chainWebpack: (config) => { config.plugin('copy').use(CopywebpackPlugin, [ { patterns: [ { from: path.join(dvgisDist, 'dc-sdk/dist/resources'), to: path.join(__dirname, 'dist', 'libs/dc-sdk/resources'), }, ], }, ]) }, } ``` ## Start ```js global.DC = DC DC.use(DcCore) // node DC.ready(() => { let viewer = new DC.Viewer(divId) // divId is the Id attribute value of a div node. If it is not passed in, the 3D scene cannot be initialized }) ``` ## Demo |  |  |  |  | | :-----------------------------------------------------------: | :-----------------------------------------------------------: | :------------------------------------------------------------------: | :--------------------------------------------------------------: | |  |  |  |  | |  |  |  |  | [More>>](http://dc.dvgis.cn/#/examples) ## Ecosystem | Module | Status | Description | | :------ | :------: | :------ | | [dc-chart](https://github.com/dvgis/dc-chart) |