JT-CIM-API/docs/theme-reco/jtprint.md

---

title: 地图打印组件

date: 2023-07-17

[[toc]]

1. jt-print 简介

• 实现屏幕截图、地图打印功能

2.Warning

::: warning 注意

• 需要获取store.appStore.runtimeEnvironment判断运行环境，APP端不支持此功能！
• 使用ref标记组件时，同时需要定义标记名称！ :::

3. jt-print API

属性名	说明	类型	是否必须
viewer	视图	obj	是
mapOptions	存储运行环境	obj	是

4. 代码示例

<jt-popup title="地图打印" showfooter="false" longheader="1" right="calc(50% - 480rem)" width="960rem" top="calc(50% - 270rem)" height="600rem">
	<jt-print :viewer="viewer" :options="mapOptions"></jt-print>
</jt-popup>

<script setup>
	import {
		onBeforeUnmount,
		inject,
		ref
	} from "vue";

	import {
		useWidget
	} from "@/common/store/widget"
	const {
		disable,
		currentWidget
	} = useWidget();

	import store from '@/store/index';

	/**
	 * 获取地图对象
	 */
	const getMapInstance = inject("getMapInstance");
	let jtMap3d = getMapInstance();
	let viewer = jtMap3d._viewer;

	const isshowfooter = ref(false)

	const mapOptions = {
		runtimeEnvironment: store.appStore.runtimeEnvironment
	}

	/**
	 * 即将销毁
	 */
	onBeforeUnmount(() => {
		// 释放当前的widget
		disable(currentWidget.name);
	});
</script>