<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>住房公积金数据可视化分析平台</title>
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/element-ui.css" />
<link rel="stylesheet" href="../openLayers/css/ol.css">
<link rel="stylesheet" href="../openLayers/css/olStyle.css">
<link rel="stylesheet" href="../css/style.css" />
<style>
.layerPop{position: fixed; left:60px; top:50%; margin-top: -300px; width:400px; height:600px;z-index: 10;}
.tab{ background-color: #FFF; height: 550px; border-radius:4px; box-shadow:0px 0px 13px rgba(0,0,0,0.2); padding: 20px 20px 0 20px;}
.btnSave{ display: inline-block; margin-top: 10px; width: 100%; height:40px; line-height: 40px; text-align: center; background-color: #0375de; color: #FFF; border-radius:6px; font-size:16px; font-weight:bolder; text-decoration:none;box-shadow:0px 0px 13px rgba(0,0,0,0.2)}
.has-gutter{ display: none;}
.el-table td.el-table__cell, .el-table th.el-table__cell.is-leafs{ border-color:#e7f0ff}
.el-table .el-table__cell{ padding: 5px 0;}
.flag{ display: inline-block; width: 10px; height: 14px; margin-right: 5px; background:url(../images/icon_flag.png) no-repeat;}
.el-table .cell{ padding: 0 5px;}
i.icon_flag{ display: inline-block; width: 12px; height: 23px; background: url("../images/icon.png") no-repeat; vertical-align: middle;}
</style>
</head>
<body>
<div id="app" v-cloak style="overflow: hidden">
<div class="layerPop">
<div class="tab">
<el-select v-model="sltyear" placeholder="请选择" size="small" style="width: calc(50% - 10px); margin-bottom: 5px; float: left;">
<el-option
v-for="item in sltYearList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model="sltArea" placeholder="请选择" size="small" style="width: calc(50% - 10px); margin-left: 20px; margin-bottom: 5px; float: left;">
<el-option
v-for="item in sltAreaList"
:key="item['行政区划编码']"
:label="item['行政区划名称']"
:value="item['行政区划编码']">
</el-option>
</el-select>
<el-table ref="table" :row-class-name="tableRowClassName" :data="tableData" max-height='480' style="width: 100%;" highlight-current-row @cell-click="cellClick" class="pointerTab">
<el-table-column prop="" label="" align="left">
<template slot-scope="scope">
<div style="width: 20px; float: left;"><i class="icon_flag" v-if="scope.row['地图信息']"></i> </div>
<div style=" width: calc(100% - 20px); float: left;">{{ scope.row['住房位置'] }}（{{isEmpty(scope.row['区县名称'])}}）</div>
<div class="clear"></div>
</template>
</el-table-column>
<el-table-column prop="" label="" align="center" width='90'>
<template slot-scope="scope">
<el-button type="primary" size='mini' class="myBtn" @click.native.stop='handleFlag(scope.$index, scope.row)'><i class="flag fl"></i><span class="fl" style="font-size: 14px;">标记</span></el-button>
</template>
</el-table-column>
</el-table>
</div>
<a href="javascript:void(0)" class="btnSave" @click="saveBtnClick" v-show="addFlag==1">保存</a>
</div>
<div id="map" style="width:100%; height: 100%;"><div id="popup"></div></div>
<div id="mouse-position"></div>
<el-dialog title="保存标记" :visible.sync="dialogVisible" width="30%" center :close-on-click-modal="false">
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="所属区县：">
<el-input v-model="form.name"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="saveForm">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</span>
</el-dialog>
</div>
<script src="../js/jq3.4.1.js"></script>
<script src="../openLayers/js/ol.js"></script>
<script src="../openLayers/js/mapper.js"></script>
<script src="../js/vue.min.js"></script>
<script src="../js/element-ui.js"></script>
<script src="../../route/route.js"></script>
<script src="../js/mapFlagManager.js"></script>
</body>
</html>
openLayers3基本写法
需积分: 0 28 浏览量
2023-08-31
16:14:39
上传
评论
收藏 160.3MB RAR 举报
openLayers3基本写法 （2000个子文件） 
element-ui.css 233KB ol.css 3KB olStyle.css 141B
mapFlagManager.html 4KB element-ui.js 573KB ol.js 476KB vue.min.js 91KB jq3.4.1.js 86KB map-v3.js 17KB mapFlagManager.js 772B mapper.js 115B 河北省.json 100KB 衡水市.json 87KB
12670.png 24KB 12672.png 21KB 3167.png 17KB 3173.png 16KB 3174.png 15KB 3177.png 14KB 3167.png 14KB 3153.png 14KB 3176.png 14KB 3167.png 14KB 12690.png 14KB 3160.png 14KB 3165.png 13KB 3173.png 13KB 12638.png 13KB 12671.png 12KB 3175.png 12KB 3177.png 12KB 12669.png 12KB 3168.png 12KB 12689.png 12KB 12719.png 12KB 12692.png 12KB 3166.png 12KB 3163.png 12KB 3178.png 11KB 12691.png 11KB 3166.png 11KB 12639.png 11KB 12613.png 11KB 12668.png 11KB 12614.png 11KB 3178.png 11KB 12612.png 11KB 3159.png 11KB 3171.png 11KB 12637.png 11KB 3170.png 11KB 12697.png 10KB 3172.png 10KB 3178.png 10KB 12664.png 10KB 3172.png 10KB 3166.png 10KB 12693.png 10KB 3158.png 10KB 3165.png 10KB 3179.png 10KB 12611.png 10KB 12715.png 10KB 3167.png 10KB 3165.png 10KB 3166.png 10KB 3174.png 10KB 3159.png 10KB 3153.png 10KB 3165.png 10KB 3172.png 9KB 3173.png 9KB 12611.png 9KB 3183.png 9KB 12612.png 9KB 12640.png 9KB 3165.png 9KB 3174.png 9KB 12639.png 9KB 12705.png 9KB 12666.png 9KB 3169.png 9KB 12694.png 9KB 3159.png 9KB 3168.png 9KB 3170.png 9KB 12675.png 9KB 3160.png 9KB 3169.png 9KB 3168.png 9KB 3173.png 9KB 3167.png 8KB 12688.png 8KB 3168.png 8KB 3173.png 8KB 3171.png 8KB 3170.png 8KB 3158.png 8KB 3159.png 8KB 12615.png 8KB共 2000 条
- 1
- 2
- 3
- 4
- 5
- 6
- 20
资源评论
