0.0.3-beta.1 • Published 3 years ago
mdt-lib v0.0.3-beta.1
添加依赖
yarn add @analytics/google-analytics@^0.5.2 @analytics/perfumejs@^0.2.0 @i18n-chain/react@^0.8.0 @loadable/component@^5.12.0 @mapbox/polylabel@^1.0.2 @mapbox/tiny-sdf@^1.2.5 @mdt/design@1.15.2 @rollup/plugin-babel@^5.3.0 @sentry/browser@5.19.0 @tanem/react-nprogress@^3.0.37 @turf/turf@^6.3.0 @types/d3-interpolate@^2.0.0 @types/eventemitter2@^4.1.0 @types/exceljs@^1.3.0 @types/html2canvas@0.0.35 @types/localforage@0.0.34 @types/stats.js@^0.17.0 @types/xlsx@0.0.36 @videojs/http-streaming@^2.5.0 ali-oss@^6.9.1 ali-react-table-fork@^0.0.9 analytics@^0.7.0 anymatch@^3.1.2 awesome-phonenumber-fork@^1.0.4 axios@^0.19.2 blob@^0.1.0 bootstrap@^3 brace-fork@^1.0.1 braft-convert@^2.1.4 braft-editor@2.3.9 braft-utils@^3.0.12 buffer@^5.6.0 chroma-js@^2.1.0 classnames@^2.2.6 co@^4.6.0 component-emitter@^1.3.0 conventional-gitlab-releaser-fork@^4.0.5 coordtransform@^2.1.2 copy-to-clipboard@^3.3.1 core-js@^3.8.1 core-util-is@^1.0.2 crypto-js@^4.1.1 dayjs@^1.10.5 dom-to-image@^2.6.0 draft-js@^0.10.5 draft-js-export-html@^1.4.1 draft-js-import-html@^1.4.1 draftjs-utils@^0.9.4 earcut@^2.2.2 echarts@^5.0.2 echarts-wordcloud@^2.0.0 entity-convert@^1.0.0 eventemitter2@^6.4.3 exceljs@^4.1.1 faker@^5.1.0 file-saver@^2.0.5 filesaver.js-npm@^1.0.1 gcoord@^0.2.3 geobuf@^3.0.1 html2canvas@^1.0.0-rc.5 ignore-loader@^0.1.2 immutable@~3.7.4 is-email@^1.0.0 is-url@^1.2.4 is-uuid@^1.0.2 jquery@^3.5.1 js-beautify@^1.11.0 js-cookie@^3.0.0-rc.0 jszip@^3.5.0 konva@7.2.0 localforage@^1.9.0 lodash@^4.17.15 lz-string@^1.4.4 maptalks@1.0.0-alpha.15 maptalks.three@^0.16.0 mb-sketch-ruler@^1.2.0-dev.11 minio@^7.0.19 mobx@^5.15.4 mobx-react@^6.2.2 omit.js@^1.0.2 perfect-scrollbar@^1.5.0 perfume.js@^5.3.0 progress-bar-webpack-plugin@^2.1.0 qs@^6.10.1 rbush@^3.0.1 rc-menu@^8.3.1 react@^17.0.2 react-ace-fork@^1.0.0 react-beautiful-dnd@^13.0.0 react-color@^2.18.1 react-contextmenu@^2.14.0 react-copy-to-clipboard@^5.0.2 react-countup@^4.3.3 react-dnd-html5-backend@^11.1.3 react-dom@^17.0.2 react-draggable@^4.4.2 react-dropzone@^11.0.1 react-id-swiper@^4.0.0 react-is@^17.0.1 react-lazyload@^3.0.0 react-markdown@^5.0.2 react-pdf@^4.1.0 react-progressive-bg-image@^3.0.0 react-resizable@^1.10.1 react-rnd@^10.1.10 react-router-dom@^5.2.0 react-sticky@^6.0.3 react-syntax-highlighter@^15.3.0 react-transition-group@^4.4.1 react-use@^14.3.0 react-virtualized@^9.21.2 screenfull@^5.1.0 simple-statistics@^7.1.0 simpleheat@^0.4.0 socket.io-client@^2.3.0 spark-md5@^3.0.1 sql-formatter-fork@^1.0.3 stats.js@^0.17.0 superstruct@^0.10.12 swiper@^5.4.5 tableexport@^5.2.0 three@0.126.1 three-text2d@^0.6.0 tree-model@^1.0.7 troika-three-text@^0.40.0 turf-multilinestring@^1.0.2 turf-multipolygon@^1.0.1 turf-point@^2.0.1 turf-polygon@^1.0.3 u2f-api@^1.1.1 url-join@^4.0.1 uuid@^8.2.0 video.js@^7.10.2 wkx@^0.5.0 xlsx@^0.16.6
使用
npm install mdt-lib
yarn add mdt-lib
import MapEditView from 'mdt-lib/MapEditView'; // 地图组件,使用到地图时引入
import ChartPreview from 'mdt-lib/ChartPreview'; // 图表组件,使用到图表时引入
import 'mdt-lib/ChartPreview.css'; // 地图 | 图表 所有的样式代码。使用必须引入
<MapEditView
id="9bb6331a-a762-4a39-b3ce-34d055c6fef6" // 地图在编辑页面时 地址栏id
token={'965f3e3d-8b35-4487-aa01-cf8b6dc61f66'}// 地图拥有者的 user_token
type="work" // work 为工作台状态
appid={'88'} // 地图拥有者所对应的app的id
style={{ width: '100vw', height: '100vh'}} // 地图大小等设置
/>
<ChartPreview
chartUuid="17be665f-874e-4c78-b69c-1313d6b55c25"// 图表在编辑页面 地址栏id
token={'965f3e3d-8b35-4487-aa01-cf8b6dc61f66'}// 图表拥有者的 user_token
style={{width: '100px', height: '100px'}}// 地图大小等设置
/>
注意
安装依赖时,如果遇到经常失败可替换.npmrc文件(部分需公司内网)
registry="https://nexus3.idatatlas.com/repository/npm-mdt/" sass_binary_site="https://npm.taobao.org/mirrors/node-sass/" phantomjs_cdnurl="http://cnpmjs.org/downloads" sentrycli_cdnurl="https://npm.taobao.org/mirrors/sentry-cli" # electron_mirror="https://npm.taobao.org/mirrors/electron/" # sqlite3_binary_host_mirror="https://foxgis.oss-cn-shanghai.aliyuncs.com/" # profiler_binary_host_mirror="https://npm.taobao.org/mirrors/node-inspector/" # chromedriver_cdnurl="https://cdn.npm.taobao.org/dist/chromedriver"
需要在index.html的html标签上添加 data-theme="dark"(目前代表组件的主题,未来可能优化)
window.__DATAMAP_CFS__ 参数说明
export interface DatlasConfig {
base: {
host: string;
force_update: boolean; // 是否开启强制刷新
gtm: boolean;
recommend_url: string;
ga_track_id: string;
lcp_url: string;
language: string; // 默认语言
title: string; //网页标题
ico: string; // 网页icon
encode_apis?: {
match: string;
encode_body_keys?: string[];
encode_query_keys?: string[];
unencode_body_keys?: string[];
unencode_query_keys?: string[];
}[]; //encode_keys不传就encode全部
encode_apis_headers?: ObjectInterface;
sentry_dsn?: string;
};
// file_server?: {
// private: boolean; //是否私有化,私有化则走文件服务器上传
// oss_bucket: string;
// oss_bucket_private: string;
// privateRead: boolean; //是否私有读,默认是false
// };
// websocket
ws: {
host: string;
};
statics: {
host: string;
};
admin: {
host: string;
};
old: {
host: string;
};
// 外链分享
share: {
host: string;
};
// 数据市场
store: {
host: string;
};
map: {
settings: object;
};
login: {
privacy: boolean; // 是否显示协议
wechat_appid: string;
wechat_redirect: string;
ding_appid: string;
ding_redirect: string;
u2f_appid: string;
register: boolean; // 是否显示注册
oa_api: string; // oa登陆 api, 密码登陆使用oa登录地址
sso?: {
out: boolean; // 是否走SSO认证
params?: string[] | null; // ["token", 'impli'] url query里字段, 字符串数组
api_params?: string[] | null; // api 的请求参数 ticket=xxx
cookie?: { cookie_key: string; body_key: string }[] | null;
api_method: string; // post | get(default)
api: string; //免密登陆接口地址 // https://dev.idatatlas.com/auth/sso/login
logout_ref: string; // 退出登陆返回地址
error_page?: string; // 接口解析失败的回调地址
};
header_logo_url: string; // header logo
logo_url: string; // 设置logo
bg_url: string; // 设置背景
bg_type: string; // 背景类型(暂支持iamge, 后续可支持video)
default_by: string; // 设置默认登录项
login_bys: string[] | null; // 设置登陆项 'byphone', 'bywechat', 'byu2f', 'byname', 'bydingtalk'
personalized_success_jump_url: string; // 设置登录成功后跳转url https://xxx.com/?dmcfrom=DM_FROM_PLACEHOLD&dmctk=DM_TOKEN_PLACEHOLD
page_style: object | null; // 自定义样式
page_extra: object | null; // 其他属性
};
}
0.0.3-beta.1
3 years ago