使用说明

npm install @datlas/mdt-lib

yarn add @datlas/mdt-lib

import MapEditView from '@datlas/mdt-lib/MapEditView'; // 地图组件，使用到地图时引入
import ChartPreview from '@datlas/mdt-lib/ChartPreview'; // 图表组件，使用到图表时引入
import '@datlas/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'}}// 地图大小等设置
        />

• 需要在index.html的html标签上添加 data-theme="dark"（目前代表组件的主题，未来可能优化）

window.__DATAMAP_CFS__ 参数说明

const matchs = new RegExp(/(\d+)$/).exec(window.location.host.split('.')[0]);
let env;
if (matchs) {
  env = matchs[1];
}
window.__DATAMAP_CFS__ = {
  filePreviewUrl: 'https://kkfileview.maicedata.com/onlinePreview',
  deployPublicPath: '/dataapp/',
  deployCdnPath: !env || env === '1' ? `https://statics-cdn${env || ''}.maicedata.com` : '',
  deployEnableHashRouter: false,
  publicFileHost: 'https://public-cdn.maicedata.com/',
  base: {
    host: window.location.host + '/api',
    force_update: false,
    gtm: false,
    recommend_url: 'resource.idatatlas.com/recommend',
    // ga_track_id: 'UA-152890991-6',
    ga_track_id: '',
    language: '',
    title: '', //网页标题
    ico: '', // 网页icon
  },
  noPermissionPageTip: '', // 没权限页面文案
  hideLogout: false, //是否隐藏预览页“退出登录”
  enableBff: false, //是否启用bff
  enableWxSdk: true,
  wxShareTitle: '欢迎使用脉策Datlas', // 微信分享标题
  wxShareDesc: '快速发布你的“地图轻应用”', // 微信分享描述
  wxShareLink: '', // 微信分享链接
  wxShareImgUrl: 'https://statics-cdn.maicedata.com/datlas-statics/images/logo.svg', // 微信分享图标
  sentry: {
    enable: true,
    env: 'prod',
    dsn: 'https://[email protected]/14',
  },
  // file_server: {
  //   private: false,
  //   // oss_bucket: 'mdt-staging-public.oss-cn-hangzhou.aliyuncs.com',
  //   oss_bucket: 'minio.idatatlas.com/mdt-staging-public/',
  //   oss_bucket_private: 'mdt-staging.oss-cn-hangzhou.aliyuncs.com',
  //   privateRead: false,
  // },
  ws: { host: window.location.origin },
  statics: { host: window.location.host + '/datlas-statics' },
  admin: { host: 'https://admin.maicedata.com' },
  old: { host: 'https://www.maicedata.com/' },
  share: { host: window.location.origin + '/' },
  storeOld: { host: 'https://datamarket.maicedata.com/' },
  store: { host: window.location.origin + '/datamarket/' },
  factory: { host: window.location.origin + '/datafactory/' },
  collector: { host: 'https://collectoradmin.maicedata.com' },
  workFlow: { host: window.location.origin + '/workflow' },
  oneTable: { host: window.location.origin + '/onetable' },
  organizationManagement: { host: window.location.origin + '/iframe-dataapp/orgadmin/' },
  ResourceShare: { host: window.location.origin + '/iframe-dataapp/share/' },
  jsonEditor: { host: window.location.origin + '/mdtamiseditor/' },
  mapEditor: { host: window.location.origin + '/dataeditor/' },
  matomo: {
    host: 'https://matomo.idatatlas.com/js/container_3dk0d2p3.js',
  },
  map: { settings: {} },
  myData: {
    host: window.location.origin + '/iframe-dataapp/mydata',
  },
  helpCenter: {
    host: window.location.origin + '/statics/help/datlas/#/zh-cn/quick_start/datlas_introduction',
  },
  login: {
    privacy: true,
    wechat_appid: 'wx737a39a6ecfb066a',
    wechat_redirect: '',
    ding_appid: 'dingoah6wnj05gogocpavz',
    ding_redirect: '',
    u2f_appid: '',
    register: false,
    oa_api: '',
    sso: {
      out: false,
      params: null, // ticket、code，url query里字段
      api_params: null, // api请求参数 ['ticket'] ticket=xxx
      cookie: null, // [{ cookie_key: 'AuthUser_AuthToken'; body_key: 'auth_token' },{cookie_key: 'AuthUser_LoginId'; body_key: 'login_id'}];
      api_method: '', // post | get(default)
      api: '', //免密登陆接口地址 // https://dev.idatatlas.com/auth/sso/login
      logout_ref: window.location.origin + '/sso/', // 退出登陆返回地址
      error_page: '', // 接口解析失败的回调地址
    },
    header_logo_url: '',
    logo_url: '',
    bg_url: '',
    bg_type: '',
    default_by: '',
    login_bys: null,
    personalized_success_jump_url: '',
    page_style: null,
    page_extra: null,
  },
};

地图props

| props | 类型 | 默认值 | 描述 | | ---------------- |-----------------------------------------------|--------| ------------------ | | id | string | ‘000’ | 查找/接口等uuid | | type | string | 'work'\ |'empty' | 地图类型 | | token | string | '' | 接口权限token | | appid | string | '' | user所在app | | DatlasCfg | object | {} | window.__DATAMAP_CFS__ | | style | CSSProperties | - | 组件外层包裹样式 | | cardCustomerMenu | ( { cardId } ) => React.ReactNode | - | 自定义card-menu | | customerIcons | { showIcon?: string; hideIcon?: string; } | - | 部分icon自定义设置 |