Skip to content

F
founder_vue
Commit c0996d3f by 李萌萌
Options

文本信息放到point图层中

parent efa2a985
Showing with 79 additions and 110 deletions
src/views/SystemManage/QueryPermission.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-12-24 09:50:39 * @Date: 2021-12-24 09:50:39
* @LastEditTime: 2022-01-13 16:22:13 * @LastEditTime: 2022-01-14 13:56:36
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: \founder_vue\src\views\SystemManage\QueryPermission.vue * @FilePath: \founder_vue\src\views\SystemManage\QueryPermission.vue
...@@ -38,7 +38,9 @@ ...@@ -38,7 +38,9 @@
<el-checkbox class="ckbAuto" fill="#055FE7" v-model="isAutoDistribute" <el-checkbox class="ckbAuto" fill="#055FE7" v-model="isAutoDistribute"
>省厅总数自动分配</el-checkbox >省厅总数自动分配</el-checkbox
> >
<button @click="autoDistribute" class="f-primary-button">一键分配</button> <button @click="autoDistribute" class="f-primary-button">
一键分配
</button>
</div> </div>
<div class="stTongji"> <div class="stTongji">
<div>省/区厅发查询总数：</div> <div>省/区厅发查询总数：</div>
...@@ -226,24 +228,44 @@ export default { ...@@ -226,24 +228,44 @@ export default {
features: featuresP, features: featuresP,
}), }),
style: function(feature) { style: function(feature) {
const style = new Style({ const style = [
text: new Text({ new Style({
font: "14px HarmonyOS_Sans_SC-Bold, HarmonyOS_Sans_SC", text: new Text({
fill: new Fill({ font: "14px HarmonyOS_Sans_SC-Bold, HarmonyOS_Sans_SC",
color: "rgba(255, 255, 255, 1)", fill: new Fill({
color: "rgba(255, 255, 255, 1)",
}),
offsetY: -35,
textAlign: "center",
text: feature.get("totalCount") || "",
}),
image: new Icon({
anchor: [0.5, 120],
scale: 0.5,
anchorXUnits: "fraction",
anchorYUnits: "pixels",
src: marker,
}), }),
offsetY: -35,
textAlign: "center",
text: feature.get("totalCount") || "",
}), }),
image: new Icon({ new Style({
anchor: [0.5, 120], text: new Text({
scale: 0.5, font: "14px HarmonyOS_Sans_SC",
anchorXUnits: "fraction", fill: new Fill({
anchorYUnits: "pixels", color: "rgba(255, 255, 255, 1)",
src: marker, }),
backgroundFill: new Fill({
color: "rgba(0, 0, 0, 0.6) ",
}),
backgroundStroke: new Stroke({
color: "rgba(255, 255, 255, 1)",
width: 1,
}),
textAlign: "center",
padding: [3, 1, 0, 3],
text: feature.get("MC"),
}),
}), }),
}); ];
return style; return style;
}, },
}); });
...@@ -258,22 +280,6 @@ export default { ...@@ -258,22 +280,6 @@ export default {
color: "#fff", color: "#fff",
width: 2, width: 2,
}), }),
text: new Text({
font: "14px HarmonyOS_Sans_SC",
fill: new Fill({
color: "rgba(255, 255, 255, 1)",
}),
backgroundFill: new Fill({
color: "rgba(0, 0, 0, 0.6) ",
}),
backgroundStroke: new Stroke({
color: "rgba(255, 255, 255, 1)",
width: 1,
}),
textAlign: "center",
padding: [3, 1, 0, 3],
text: feature.get("MC"),
}),
}); });
return style; return style;
}, },
...@@ -281,24 +287,6 @@ export default { ...@@ -281,24 +287,6 @@ export default {
selectedRegionLayer = new VectorLayer({ selectedRegionLayer = new VectorLayer({
source: new VectorSource(), source: new VectorSource(),
style: function(feature) { style: function(feature) {
const pstyle = new Style({
text: new Text({
font: "14px HarmonyOS_Sans_SC-Bold, HarmonyOS_Sans_SC",
fill: new Fill({
color: "#333333",
}),
offsetY: -35,
textAlign: "center",
text: feature.get("totalCount") || "",
}),
image: new Icon({
scale: 0.5,
anchor: [0.5, 120],
anchorXUnits: "fraction",
anchorYUnits: "pixels",
src: markers,
}),
});
const rstyle = new Style({ const rstyle = new Style({
fill: new Fill({ fill: new Fill({
color: "rgba(154, 218, 252, 0)", color: "rgba(154, 218, 252, 0)",
...@@ -307,67 +295,48 @@ export default { ...@@ -307,67 +295,48 @@ export default {
color: "#055FE7", color: "#055FE7",
width: 3, width: 3,
}), }),
text: new Text({
font: "14px HarmonyOS_Sans_SC",
fill: new Fill({
color: "rgba(51, 51, 51, 1)",
}),
backgroundFill: new Fill({
color: "rgba(255, 255, 255, 1)",
}),
textAlign: "center",
padding: [3, 1, 0, 3],
text: feature.get("MC"),
}),
}); });
const isPoint = feature.getGeometry() instanceof Point; return rstyle;
return isPoint ? pstyle : rstyle;
}, },
}); });
selectedPointLayer = new VectorLayer({ selectedPointLayer = new VectorLayer({
source: new VectorSource(), source: new VectorSource(),
style: function(feature) { style: function(feature) {
const pstyle = new Style({ const pstyle = [
text: new Text({ new Style({
font: "14px HarmonyOS_Sans_SC-Bold, HarmonyOS_Sans_SC", text: new Text({
fill: new Fill({ font: "14px HarmonyOS_Sans_SC-Bold, HarmonyOS_Sans_SC",
color: "#333333", fill: new Fill({
color: "#333333",
}),
offsetY: -35,
textAlign: "center",
text: feature.get("totalCount") || "",
}), }),
offsetY: -35, image: new Icon({
textAlign: "center", scale: 0.5,
text: feature.get("totalCount") || "", anchor: [0.5, 120],
}), anchorXUnits: "fraction",
image: new Icon({ anchorYUnits: "pixels",
scale: 0.5, src: markers,
anchor: [0.5, 120],
anchorXUnits: "fraction",
anchorYUnits: "pixels",
src: markers,
}),
});
const rstyle = new Style({
fill: new Fill({
color: "rgba(154, 218, 252, 0)",
}),
stroke: new Stroke({
color: "#055FE7",
width: 3,
}),
text: new Text({
font: "14px HarmonyOS_Sans_SC",
fill: new Fill({
color: "rgba(51, 51, 51, 1)",
}), }),
backgroundFill: new Fill({ }),
color: "rgba(255, 255, 255, 1)", new Style({
text: new Text({
font: "14px HarmonyOS_Sans_SC",
fill: new Fill({
color: "rgba(51, 51, 51, 1)",
}),
backgroundFill: new Fill({
color: "rgba(255, 255, 255, 1)",
}),
textAlign: "center",
padding: [3, 1, 0, 3],
text: feature.get("MC"),
}), }),
textAlign: "center",
padding: [3, 1, 0, 3],
text: feature.get("MC"),
}), }),
}); ];
const isPoint = feature.getGeometry() instanceof Point; return pstyle;
return isPoint ? pstyle : rstyle;
}, },
}); });
...@@ -878,14 +847,14 @@ export default { ...@@ -878,14 +847,14 @@ export default {
} }
} }
.f-primary-button { .f-primary-button {
cursor: pointer; cursor: pointer;
background: #055fe7 !important; background: #055fe7 !important;
&:hover { &:hover {
background: #377fec !important; background: #377fec !important;
} }
&:active { &:active {
background: #044cb9 !important; background: #044cb9 !important;
} }
} }
// @import "@/assets/css/globalBase.scss"; // @import "@/assets/css/globalBase.scss";
</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