<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>地图展示(ArcGIS地图)title>
<link rel="stylesheet" href="http://26.3.12.41/arcgis_js_api/library/3.37/3.37/dijit/themes/claro/claro.css" />
<link rel="stylesheet" href="http://26.3.12.41/arcgis_js_api/library/3.37/3.37compact/esri/css/esri.css">
<script src="http://26.3.12.41/arcgis_js_api/library/3.37/3.37/init.js" type="text/javascript">script>
head>
<body>
<div id="map" style="width:100%;height:100%;">div>
body>
怎么把这个html 代码转成vue
望采纳
将以上 HTML 代码转换为 Vue 代码需要按照以下步骤进行:
完整的 Vue 代码如下所示:
<template>
<div>
<link rel="stylesheet" href="http://26.3.12.41/arcgis_js_api/library/3.37/3.37/dijit/themes/claro/claro.css" />
<link rel="stylesheet" href="http://26.3.12.41/arcgis_js_api/library/3.37/3.37compact/esri/css/esri.css">
<div id="map" style="width:100%;height:100%;"></div>
</div>
</template>
<script>
import { loadModules } from 'http://26.3.12.41/arcgis_js_api/library/3.37/3.37/init.js';
export default {
name: 'Map',
data() {
return {
map: null
}
},
mounted() {
loadModules(['esri/map'], { css: true })
.then(([Map]) => {
this.map = new Map('map', {
center: [26.3, 12.41],
zoom: 8
});
});
}
};
</script>