开始

IndoorMap 是 TYRCTLaserMap 的 RN 组件实现, 您可以在 RN 技术栈中使用它来进行扫地机器人地图的业务开发。

如果您需要在涂鸦小程序技术栈中或 Web 技术栈中使用, 请您使用涂鸦智能提供的@tuya/rn-mini-robot-map 基础能力包进行开发。

IndoorMap 同时也是基于涂鸦机器人协议的地图能力集成库, 可以为您快速提供行业机器人最新的地图能力, 帮您在可视化上获得竞争力。

如果您需要使用它，请务必确保使用涂鸦智能的相关机器人协议和平台。

如何使用

安装@tuya/rn-robot-map

$ yarn add @tuya/rn-robot-map

使用 IndoorMap 组件

如果您是从 TYRCTLaserMap 迁移过来, 则可以参照其使用 IndoorMap 组件。如果您是直接接入 IndoorMap 组件, 那么请仔细阅读我们的每一个文档。

mapId: IndoorMap 组件需要从外部传递一个 mapId，这个 mapId 为必须的。mapId 只需要确保其唯一性即可, 您可以提供有数字, 字母, 或任意组成的数字或字符串.

isFreezeMap: 在非必要的情况下，请始终设置 isFreezeMap 为 false。isFreezeMap 将在具备有 navigation 的环境下自动监听。并将您的地图停止渲染已节约性能。如果您在一些例如弹窗组件中设置 isFreezeMap 为 true, 程序有可能产生不受控的错误

import React, { Component } from 'react';
import { IndoorMap } from '@tuya/rn-robot-map';

interface IProps {}
interface IState {}

export default class MapView extends Component<IProps, IState> {
  id = new Date().getTime();

  render() {
    return (
      <View style={styles.container}>
        <IndoorMap mapId={this.id} isFreezeMap={false} {...elementProps} {...eventProps} />
      </View>
    );
  }
}

使用 IndoorMap 组件提供的实例方法

import { IndoorMapWebApi as LaserUIApi, IndoorMapUtils } from '@tuya/rn-robot-map';

// 获取组件实例，并对组件实例进行操作
LaserUIApi.updateSelectRoom(IndoorMapUtils.getMapInstance(mapId), this.props.selectTags);

使用 IndoorMap 组件提供的回调方法

onLoggerInfo 函数在 1.0.28 版本开始支持帮助您获取内部的 Debug 信息

const onLoggerInfoFn = (data: { info: string; theme: string; args: any }) => {
  // do something
  if (data) {
    console.log(data.info || '', data.theme || '', ...Object.values(data.args || {}));
  }
};

<IndoorMap
  mapId={this.id}
  isFreezeMap={false}
  {...elementProps}
  {...eventProps}
  onLoggerInfo={onLoggerInfoFn}
  // 您可以指定任意随机数 v1.0.29 支持
  componentId={new Date().getTime()}
  // 建议您设置initUseThread 为false, 以此您可以获得更快的首屏加载
  // v1.0.45 支持
  initUseThread={false}
  // 建议您在安卓平台上的多地图页面设置resourceUsageLevel 为 low, 以此可以帮助您降低安卓上同时加载多个地图带来的性能过度损耗
  // v1.0.45 支持
  resourceUsageLevel="low"
  // v1.0.45 支持
  // 该能力目前仅对性能提升有帮助, 请您始终设置为false
  enableAICapability={false}
  // 默认是透明色, 如果在您的安卓平台上，出现了加载失败显示Android 图标的问题，请设置成和您的应用背景色一致来覆盖它  v1.0.29 支持
  componentBackground={'#FFFFFF'}
/>

详细使用

详细使用文档请参考目录下的 docs 文件夹下的说明文件

版本更新记录

版本更新记录请参考目录下的 docs 文件夹下的 changelog.md