Skip to content

W
whp-xl
Commit ede73aa5 authored by yaqizhang's avatar yaqizhang
Browse files
Options

大屏

parent 6c16b6f3
Show whitespace changes
Inline Side-by-side
Showing with 83 additions and 25 deletions
dcit-hcsystem-hcsystem-master/src/views/Enterprises/demo.vue
View file @ ede73aa5
...@@ -189,7 +189,7 @@ export default { ...@@ -189,7 +189,7 @@ export default {
padding: 30px; padding: 30px;
} }
.el-main .el-tabs .el-tabs__content{ .el-main .el-tabs .el-tabs__content{
background-image: url(gif.gif); background-image: url(bg.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
/* height: 100%; */ /* height: 100%; */
......
dcit-hcsystem-hcsystem-master/src/views/qyMap/qyMap.vue
View file @ ede73aa5
...@@ -4,10 +4,39 @@ ...@@ -4,10 +4,39 @@
<!-- <Search :MAP="MAP" :Mutil="Mutil" v-if="mapLoadDone"></Search> --> <!-- <Search :MAP="MAP" :Mutil="Mutil" v-if="mapLoadDone"></Search> -->
<!-- <DrawTool :MAP="MAP" v-if="mapLoadDone"></DrawTool> --> <!-- <DrawTool :MAP="MAP" v-if="mapLoadDone"></DrawTool> -->
<!-- <div style="width:200px;height:250px;" class="show-box" > --> <!-- <div style="width:200px;height:250px;" class="show-box" > -->
<button @click="Mutil.tianSlA()">切换1</button> <div style="position:absolute;left:500px;top:10px">
<button @click="Mutil.tianSlB()">切换2</button> <button @click="Mutil.tianSlA()" class="map-botton">切换1</button>
<button @click="Mutil.tianSlC()">切换3</button> <button @click="Mutil.tianSlB()" class="map-botton">切换2</button>
<dv-border-box-10 class="show-box" :color="['#4980b5','#4980b5']" backgroundColor="rgba(255, 255, 255, 0.5)" style="width:220px;height:280px;" > <button @click="Mutil.tianSlC()" class="map-botton">切换3</button>
</div>
</div>
<!-- <div class="markBox">
<ul>
<li><img width="10px" src="@/assets/mark/markqy.png" /> 企业图例</li>
</ul>
</div> -->
<!-- <div class="BoxWrap">
<div class="horn">
<div class="lt"></div>
<div class="rt"></div>
<div class="rb"></div>
<div class="lb"></div>
</div>
</div> -->
<div style="">
<div style="width: 500px;height: 100%;z-index: 11;background-color: rgba(2, 40, 90, 0.4);position: absolute;top: 0;left: 10px;float: left;">
<div id="pieReport" style="width: 480px;height: 200px;background-color: rgba(2, 20, 44, 0.5);margin-top: 30px;margin-left: 10px;"></div>
<div id="pieReport" style="width: 480px;height: 250px;background-color: rgba(2, 20, 44, 0.5);margin-top: 30px;margin-left: 10px;"></div>
<div id="pieReport" style="width: 480px;height: 250px;background-color: rgba(2, 20, 44, 0.5);margin-top: 30px;margin-left: 10px;"></div>
<!-- <div id="pieReport" style="width: 400px;height: 300px;background-color: rgba(2, 20, 44, 0.4)"></div> -->
</div>
<div style="width: 500px;height: 100%;z-index: 12;background-color: rgba(0, 0, 0, 0.3);position: absolute;top: 0;right: 10px;float: right">
<!-- <dv-border-box-10 class="show-box" :color="['#4980b5','#4980b5']" backgroundColor="rgba(255, 255, 255, 0.5)" style="width:220px;height:280px;" >
<div class="markBox"> <div class="markBox">
<ul> <ul>
<div class="ul-div"><li><img width="15px" src="@/assets/mark/markqy.png" /> 注册企业 <span>{{tjNumberObj.enterpriseRegNum}}</span></li></div> <div class="ul-div"><li><img width="15px" src="@/assets/mark/markqy.png" /> 注册企业 <span>{{tjNumberObj.enterpriseRegNum}}</span></li></div>
...@@ -25,23 +54,11 @@ ...@@ -25,23 +54,11 @@
<div class="ul-div"><li><img width="20px" src="@/assets/mark/yinhuan.png" /> 隐患<span>0</span></li></div> <div class="ul-div"><li><img width="20px" src="@/assets/mark/yinhuan.png" /> 隐患<span>0</span></li></div>
</ul> </ul>
</div> </div>
</dv-border-box-10> </dv-border-box-10></div> -->
<div id="pieReport" style="width: 480px;height: 200px;background-color: rgba(2, 20, 44, 0.5);margin-top: 30px;margin-left: 10px;"></div>
<div id="pieReport" style="width: 480px;height: 250px;background-color: rgba(2, 20, 44, 0.5);margin-top: 30px;margin-left: 10px;"></div>
<div id="pieReport" style="width: 480px;height: 250px;background-color: rgba(2, 20, 44, 0.5);margin-top: 30px;margin-left: 10px;"></div>
</div> </div>
<!-- <div class="markBox">
<ul>
<li><img width="10px" src="@/assets/mark/markqy.png" /> 企业图例</li>
</ul>
</div> -->
<!-- <div class="BoxWrap">
<div class="horn">
<div class="lt"></div>
<div class="rt"></div>
<div class="rb"></div>
<div class="lb"></div>
</div>
</div> -->
</div> </div>
</div> </div>
</template> </template>
...@@ -60,6 +77,13 @@ import "@/utils/VamapLoad.ts"; ...@@ -60,6 +77,13 @@ import "@/utils/VamapLoad.ts";
import DrawTool from "@/components/drawTool.vue"; import DrawTool from "@/components/drawTool.vue";
import Search from "@/components/search.vue"; import Search from "@/components/search.vue";
import Mutil from "@/utils/mapUtil.js"; import Mutil from "@/utils/mapUtil.js";
let echarts = require('echarts/lib/echarts')
// 引入饼状图组件
require('echarts/lib/chart/pie')
// 引入提示框和title组件
require('echarts/lib/component/tooltip')
require('echarts/lib/component/title')
import METHOD from "@/utils/methods";
@Component({ @Component({
components: { components: {
DrawTool, DrawTool,
...@@ -67,6 +91,17 @@ import Mutil from "@/utils/mapUtil.js"; ...@@ -67,6 +91,17 @@ import Mutil from "@/utils/mapUtil.js";
}, },
}) })
export default class GIS extends Vue { export default class GIS extends Vue {
data() {
return {
charts: "",
opinion: ["及格人数", "未及格人数"],
opinionData: [
{ value: 12, name: "及格人数", itemStyle: "#1ab394" },
{ value: 18, name: "未及格人数", itemStyle: "#79d2c0" }
]
};
}
@Provide() Mutil: any; @Provide() Mutil: any;
@Provide() mapLoadDone = false; @Provide() mapLoadDone = false;
@Provide() MAP: any; @Provide() MAP: any;
...@@ -262,6 +297,9 @@ export default class GIS extends Vue { ...@@ -262,6 +297,9 @@ export default class GIS extends Vue {
}) })
this.getStatiData(); this.getStatiData();
this.Mutil.changeCenter("石家庄"); this.Mutil.changeCenter("石家庄");
// this.$nextTick(function() {
// this.drawPie("pieReport");
// });
} }
getStatiData() { getStatiData() {
let that = this; let that = this;
...@@ -315,6 +353,22 @@ export default class GIS extends Vue { ...@@ -315,6 +353,22 @@ export default class GIS extends Vue {
<style lang="scss"> <style lang="scss">
@import "@/utils/public.scss"; @import "@/utils/public.scss";
.map-botton{
width: 100px;
height: 50px;
outline: none;
z-index: 10;
position:absolute;
}
.map-botton:nth-child(1){
left:50px;
}
.map-botton:nth-child(2){
left:160px;
}
.map-botton:nth-child(3){
left:270px;
}
/* // .BoxWrap{ /* // .BoxWrap{
// width: 200px; // width: 200px;
// height: 200px; // height: 200px;
...@@ -368,7 +422,7 @@ export default class GIS extends Vue { ...@@ -368,7 +422,7 @@ export default class GIS extends Vue {
.markBox { .markBox {
width: 100%; width: 100%;
z-index: 9; z-index: 12;
ul { ul {
.ul-div{ .ul-div{
margin-left: -30px; margin-left: -30px;
...@@ -404,4 +458,8 @@ export default class GIS extends Vue { ...@@ -404,4 +458,8 @@ export default class GIS extends Vue {
top: 14px; top: 14px;
left: 80px; left: 80px;
} }
.ol-zoom {
top: .5em;
left: 500px !important;
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment