交通云ie项目笔记

 

1.ie 下的select

select {//ie下拉
    border: solid 1px #000; 
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    padding-right: 14px;
    background: url("../images/arrow.png") no-repeat scroll right center transparent;
}
select::-ms-expand { display: none; }

2.存储

3.es6语法转换成es5语法

a创建两个文件夹分别为src 、dist如下图：(src为待转换es6 js存放目录，dist为编译完成后的es5 js存放目录)。

b在src目录下新建一个js文件（这里起名叫做index.js），里面输入es6的代码。

c初始化项目：npm  init 命令执行完成后会在根目录生成package.json文件。build：设置待转换路径和转换后的路径

d全局安装babel工具：1>npm install -g babel-cli 2>npm install --save-dev babel-preset-es2015 babel-cli

e新建.babelrc

f:编译npm run build

4.element el-tree实现单选

5.vmware 

虚拟机ip不通，停止（或关闭）networkmanager 服务

6.ArcGis for JavaScript 之 搭建Vue项目及加载底图

因为是使用的Vue框架，而esri官方也提供了esri-loader这个包，所以第一件事在GitHub上找到这个包(虽然只有不到两百个star)，然后阅读README.md,阅读后获得以下信息

• 安装:npm install --save esri-loader 或者 yarn add esri-loader
• 引入样式：@import url('https://js.arcgis.com/3.24/esri/css/esri.css');
• 没有介绍引入JS的方法，但是介绍了一种懒加载JS的方法，当然这个也可用于选择API的版本，也可以改变URL为本地离线部署的地址，例如：

const options = {
  url: 'https://js.arcgis.com/3.24/' // 这里的API地址可以是官网提供的CDN，也可在此配置离线部署的地址
}
esriLoader.loadModules(['esri/map'], options) // 传入需要使用的类
.then(([Map]) => {
  // doSomeThing
})
.catch(err => {
  console.error(err)
})

 esri-loader已经下载好，现在需要对项目进行少许的配置

• 前面已经介绍了如何引入JS，和CSS，所以可以直接引入即可，但是因为服务的地址较多，为了后期方便维护和修改，这里我们可以新建一个管理服务地址的文件，serviceUrl.js

export const ServiceUrl = {
    baseMap: 'topo' // 这里可以定义自己服务器上的底图的地址，也可以使用ArcGis提供的底图，详见Basemap类
}

 

• 新建baseMap.js

• <template>
    <div class='hello'>
      <h4>{{msg}}</h4>
    </div>
  </template>
  <script>
  import { loadModules } from 'esri-loader'
  import { ServiceUrl } from './ServiceUrl'
  const option = ServiceUrl.apiUrl
  
  export default {
    name: 'baseMap',
    data () {
      return {
        msg: 'Arcgis for JavaScript 4.6 Recode'
      }
    },
    mounted () {
      loadModules(['esri/Map', 'esri/views/MapView', 'dojo/domReady!'], option).then(([Map, MapView]) => {
        // doSomeThing
      }).catch(err => {
        console.log(err)
      })
    }
  }
  </script>
  <style scoped>
  /*引入css*/
  @import 'https://js.arcgis.com/4.7/esri/css/main.css';
  </style>

  

• 图中1，我们使用的是esri-loader的loadModules来加载不同的类(模块),这里的loadModules是基于AMD异步加载模块的规范的，所以能看到基本代码骨架为loadModules().then().catch()

  图中2，如果不配置option，在源码中会自动加载官方提供的API地址,即https://js.arcgis.com/4.7/

• 创建底图

• 现在已经引入所需的基本类，Map，和MapView，现在就已经可以按照官网提供的API进行开发了，现在创建底图

  this.map = new Map({
    basemap: 'topo' // 底图类型，详见BaseMap类
  })
  this.view = new MapView({
    container: 'viewDiv', // 视图的容器
    map: map, // Map的实例放入视图中
    center: [104.06, 30.67], // 初始显示的地图中心点，经纬度
    zoom: 10 // 当前地图缩放等级
  })