elink-star
/
yifeng_integration
16
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

代码提交

master
juwei001 1 year ago
parent
5369ae48fd
commit
17a3cf58d5
2 changed files with 189 additions and 189 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 0
      src/components/screen-map-header-home/index.vue
  2. 384
      src/views/next/screen-content-left/hsyf-left/index.vue

0
src/components/screen-map-header copy/index.vue → src/components/screen-map-header-home/index.vue
View File

384
src/views/next/screen-content-left/hsyf-left/index.vue
View File

@ -196,146 +196,146 @@
</template>
<script>
import { mapActions, mapGetters } from "vuex";
import { partyOrgCategoryAndQuantity, partyPlacePage } from "@/api/hsyf";
const RADIUS = 100; // 3d球的半径
const FALLLENGTH = 500;
let CX = null;
let CY = null;
import { mapActions, mapGetters } from 'vuex'
import { partyOrgCategoryAndQuantity, partyPlacePage } from '@/api/hsyf'
const RADIUS = 100 // 3d球的半径
const FALLLENGTH = 500
let CX = null
let CY = null
class Tag {
constructor(el, x, y, z) {
this.el = el;
this.x = x;
this.y = y;
this.z = z;
constructor (el, x, y, z) {
this.el = el
this.x = x
this.y = y
this.z = z
}
move() {
const scale = FALLLENGTH / (FALLLENGTH - this.z);
const alpha = (this.z + RADIUS) / (3 * RADIUS);
const left = this.x + CX - this.el.offsetWidth / 2 + "px"; // 水平偏移
const top = this.y + CY - this.el.offsetHeight / 1 + "px"; // 竖直偏移
this.el.style.opacity = alpha;
this.el.style.zIndex = parseInt(scale * 100);
this.el.style.transform = `translate(${left},${top}) scale(${scale}) rotate(0deg)`; // 将rotate改为0度
move () {
const scale = FALLLENGTH / (FALLLENGTH - this.z)
const alpha = (this.z + RADIUS) / (3 * RADIUS)
const left = this.x + CX - this.el.offsetWidth / 2 + 'px' // 水平偏移
const top = this.y + CY - this.el.offsetHeight / 1 + 'px' // 竖直偏移
this.el.style.opacity = alpha
this.el.style.zIndex = parseInt(scale * 100)
this.el.style.transform = `translate(${left},${top}) scale(${scale}) rotate(0deg)` // 将rotate改为0度
}
}
export default {
data() {
data () {
return {
agencyList: [
{ num: 11, agency: "党委" },
{ num: 97, agency: "党支部" },
{ num: 235, agency: "党小组" },
{ num: 3496, agency: "党员" },
{ num: 11, agency: '党委' },
{ num: 97, agency: '党支部' },
{ num: 235, agency: '党小组' },
{ num: 3496, agency: '党员' }
],
typeList: [
{
imgSrc: require("@/assets/images/icon/zdwRed.png"),
type: "镇党委",
num: 1,
imgSrc: require('@/assets/images/icon/zdwRed.png'),
type: '镇党委',
num: 1
},
{
imgSrc: require("@/assets/images/icon/xcdwRed.png"),
type: "新村党委",
num: 10,
imgSrc: require('@/assets/images/icon/xcdwRed.png'),
type: '新村党委',
num: 10
},
{
imgSrc: require("@/assets/images/icon/zrcdzbRed.png"),
type: "自然村党支部",
num: 100,
imgSrc: require('@/assets/images/icon/zrcdzbRed.png'),
type: '自然村党支部',
num: 100
},
{
imgSrc: require("@/assets/images/icon/wgdxzRed.png"),
type: "网格党小组",
num: 368,
},
imgSrc: require('@/assets/images/icon/wgdxzRed.png'),
type: '网格党小组',
num: 368
}
],
tagList: [
{
name: "上泊新村委员会",
id: "1697533359860244481",
name: '上泊新村委员会',
id: '1697533359860244481'
},
{
name: "滨河村委员会",
id: "1704030137514287105",
name: '滨河村委员会',
id: '1704030137514287105'
},
{
name: "湍湾新村委员会",
id: "1704036500462198786",
name: '湍湾新村委员会',
id: '1704036500462198786'
},
{
name: "七级村委员会",
id: "1704313950756757506",
name: '七级村委员会',
id: '1704313950756757506'
},
{
name: "沽河村委员会",
id: "1704324481563582466",
name: '沽河村委员会',
id: '1704324481563582466'
},
{
name: "太祉庄村委员会",
id: "1704327114084933633",
name: '太祉庄村委员会',
id: '1704327114084933633'
},
{
name: "河流新村委员会",
id: "1704331366425518081",
name: '河流新村委员会',
id: '1704331366425518081'
},
{
name: "大坝新村委员会",
id: "1704396342955696130",
name: '大坝新村委员会',
id: '1704396342955696130'
},
{
name: "双塔村委员会",
id: "1704331366425518081",
name: '双塔村委员会',
id: '1704331366425518081'
},
{
name: "移风村委员会",
id: "1704331366425518081",
},
name: '移风村委员会',
id: '1704331366425518081'
}
],
tempList: [],
bubbleList: [
{
w: 8,
x: 10,
x: 10
},
{
w: 9,
x: 50,
x: 50
},
{
w: 4,
x: 30,
x: 30
},
{
w: 5,
x: 80,
x: 80
},
{
w: 4,
x: 30,
x: 30
},
{
w: 4,
x: 70,
x: 70
},
{
w: 6,
x: 20,
x: 20
},
{
w: 8,
x: 50,
x: 50
},
{
w: 4,
x: 60,
x: 60
},
{
w: 6,
x: 65,
},
x: 65
}
],
// yfgfTotal: 0,
// yfzdTotal: 0,
@ -344,181 +344,181 @@ export default {
yfzdList: [],
zzjsValues: [
{
partyOrgType: "3",
name: "镇党委",
value: 1,
partyOrgType: '3',
name: '镇党委',
value: 1
},
{
partyOrgType: "4",
name: "新村党委",
value: 10,
partyOrgType: '4',
name: '新村党委',
value: 10
},
{
partyOrgType: "5",
name: "自然村党支部",
value: 100,
partyOrgType: '5',
name: '自然村党支部',
value: 100
},
{
partyOrgType: "6",
name: "党小组",
value: 368,
partyOrgType: '6',
name: '党小组',
value: 368
},
{
partyOrgType: "7",
name: "党员",
value: 4106,
partyOrgType: '7',
name: '党员',
value: 4106
},
{
partyOrgType: "8",
name: "党员中心户",
value: 692,
},
],
};
partyOrgType: '8',
name: '党员中心户',
value: 692
}
]
}
},
created() {
created () {
this.bubbleList.forEach((i, index) => {
this.$set(
i,
"c",
'c',
this.forArrayValue(
[
"rgba(255,255,255,0.2)",
"rgba(255,255,255,0.4)",
"rgba(255,255,255,0.6)",
'rgba(255,255,255,0.2)',
'rgba(255,255,255,0.4)',
'rgba(255,255,255,0.6)'
],
index
)
);
});
this.getData();
)
})
this.getData()
},
mounted() {
mounted () {
this.$nextTick(function () {
this.initTag();
this.animate();
});
this.initTag()
this.animate()
})
},
beforeDestroy() {},
beforeDestroy () {},
methods: {
// ...mapGetters(['hsyfCompany']),
...mapActions({
// set_garden: 'SET_GARDEN',
set_organization: "SET_ORGANIZATION",
set_hsyf_djType: "SET_HSYF_DJTYPE",
set_hsyf_company: "SET_HSYF_COMPANY",
set_zhen_committee: "SET_ZHEN_COMMITTEE",
set_xincun_committee: "SET_XINCUN_COMMITTEE",
set_zirancun_committee: "SET_ZIRANCUN_COMMITTEE",
set_wangge_committee: "SET_WANGGE_COMMITTEE",
set_dyzxh_committee: "SET_DYZXH_COMMITTEE",
set_dangyuan_committee: "SET_DANGYUAN_COMMITTEE",
set_hsyf_attractions: "SET_HSYF_ATTRACTIONS",
set_hsyf_jzfw: "SET_HSYF_JZFW",
set_organization: 'SET_ORGANIZATION',
set_hsyf_djType: 'SET_HSYF_DJTYPE',
set_hsyf_company: 'SET_HSYF_COMPANY',
set_zhen_committee: 'SET_ZHEN_COMMITTEE',
set_xincun_committee: 'SET_XINCUN_COMMITTEE',
set_zirancun_committee: 'SET_ZIRANCUN_COMMITTEE',
set_wangge_committee: 'SET_WANGGE_COMMITTEE',
set_dyzxh_committee: 'SET_DYZXH_COMMITTEE',
set_dangyuan_committee: 'SET_DANGYUAN_COMMITTEE',
set_hsyf_attractions: 'SET_HSYF_ATTRACTIONS',
set_hsyf_jzfw: 'SET_HSYF_JZFW'
}),
getData() {
getData () {
partyOrgCategoryAndQuantity().then((res) => {
this.zzjsValues = res.data;
});
this.zzjsValues = res.data
})
partyPlacePage({ page: 1, limit: 2, type: 1 }).then((res) => {
this.yfgfList = res.data.list;
});
this.yfgfList = res.data.list
})
partyPlacePage({ page: 1, limit: 3, type: 2 }).then((res) => {
this.yfzdList = res.data.list;
});
this.yfzdList = res.data.list
})
partyPlacePage({ page: 1, limit: 3, type: 3 }).then((res) => {
this.jzfwList = res.data.list;
});
this.jzfwList = res.data.list
})
},
forArrayValue(array, sort) {
return array[sort % array.length];
forArrayValue (array, sort) {
return array[sort % array.length]
},
handelClickOrg(type, type1) {
if (type === "organization") {
this.set_organization(true);
handelClickOrg (type, type1) {
if (type === 'organization') {
this.set_organization(true)
}
if (type === "hsyf_company") {
this.set_hsyf_company(true);
if (type === 'hsyf_company') {
this.set_hsyf_company(true)
}
if (type === "hsyf_attractions") {
this.set_hsyf_attractions(true);
this.set_hsyf_djType(type1);
if (type === 'hsyf_attractions') {
this.set_hsyf_attractions(true)
this.set_hsyf_djType(type1)
}
if (type === "hsyf_jzfw") {
this.set_hsyf_jzfw(true);
if (type === 'hsyf_jzfw') {
this.set_hsyf_jzfw(true)
}
if (type === "镇党委") {
this.set_zhen_committee(true);
if (type === '镇党委') {
this.set_zhen_committee(true)
}
if (type === "新村党委") {
this.set_xincun_committee(true);
if (type === '新村党委') {
this.set_xincun_committee(true)
}
if (type === "自然村党支部") {
this.set_zirancun_committee(true);
if (type === '自然村党支部') {
this.set_zirancun_committee(true)
}
if (type === "网格党小组") {
this.set_wangge_committee(true);
if (type === '网格党小组') {
this.set_wangge_committee(true)
}
if (type === "党员中心户") {
this.set_dyzxh_committee(true);
if (type === '党员中心户') {
this.set_dyzxh_committee(true)
}
if (type === "党员数") {
this.set_dangyuan_committee(true);
if (type === '党员数') {
this.set_dangyuan_committee(true)
}
},
initTag() {
const tags = document.querySelectorAll(".tag");
const wrap = document.querySelector(".card-item-tag");
const len = tags.length;
CX = wrap.offsetWidth / 2;
CY = wrap.offsetHeight / 2;
initTag () {
const tags = document.querySelectorAll('.tag')
const wrap = document.querySelector('.card-item-tag')
const len = tags.length
CX = wrap.offsetWidth / 2
CY = wrap.offsetHeight / 2
tags.forEach((i, index) => {
const k = -1 + (2 * (index + 1) - 1) / len;
const a = Math.acos(k);
const b = a * Math.sqrt(len * Math.PI);
const x = RADIUS * 1.15 * Math.sin(a) * Math.cos(b);
const y = RADIUS * Math.sin(a) * Math.sin(b);
const z = RADIUS * Math.cos(a);
const tag = new Tag(i, x, y, z);
this.tempList.push(tag);
});
},
rotateX() {
const angleX = Math.PI / 8000;
const cos = Math.cos(angleX);
const sin = Math.sin(angleX);
const k = -1 + (2 * (index + 1) - 1) / len
const a = Math.acos(k)
const b = a * Math.sqrt(len * Math.PI)
const x = RADIUS * 1.15 * Math.sin(a) * Math.cos(b)
const y = RADIUS * Math.sin(a) * Math.sin(b)
const z = RADIUS * Math.cos(a)
const tag = new Tag(i, x, y, z)
this.tempList.push(tag)
})
},
rotateX () {
const angleX = Math.PI / 8000
const cos = Math.cos(angleX)
const sin = Math.sin(angleX)
this.tempList.forEach((i) => {
const y1 = i.y * cos - i.z * sin;
const z1 = i.z * cos + i.y * sin;
i.y = y1;
i.z = z1;
});
},
rotateY() {
const angleY = Math.PI / 200;
const cos = Math.cos(angleY);
const sin = Math.sin(angleY);
const y1 = i.y * cos - i.z * sin
const z1 = i.z * cos + i.y * sin
i.y = y1
i.z = z1
})
},
rotateY () {
const angleY = Math.PI / 200
const cos = Math.cos(angleY)
const sin = Math.sin(angleY)
this.tempList.forEach((i) => {
const x1 = i.x * cos - i.z * sin;
const z1 = i.z * cos + i.x * sin;
i.x = x1;
i.z = z1;
});
},
animate() {
this.rotateX();
this.rotateY();
const x1 = i.x * cos - i.z * sin
const z1 = i.z * cos + i.x * sin
i.x = x1
i.z = z1
})
},
animate () {
this.rotateX()
this.rotateY()
this.tempList.forEach((i) => {
i.move();
});
requestAnimationFrame(this.animate);
},
i.move()
})
requestAnimationFrame(this.animate)
}
},
components: {},
computed: {},
watch: {},
};
watch: {}
}
</script>
<style lang="scss" scoped>

Write Preview
Loading…
Cancel
Save