WebUI——领导驾驶舱

最新推荐文章于 2024-08-13 11:41:44 发布
最新推荐文章于 2024-08-13 11:41:44 发布
阅读量2.2k 收藏 8
点赞数 2
分类专栏： 前端dog
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_37970224/article/details/111932723
版权

WebUI领导驾驶舱

1、效果预览

在这里插入图片描述
“领导驾驶舱”可视化界面当下比较流行，因此以“档案数据管理为例”画了画界面，先附上效果，技术栈：angular + G2 + L7

需要装几个包: 
//G2 Chart
npm install @antv/g2 --save

// L7 依赖
npm install --save @antv/l7

// 第三方底图依赖
npm install --save @antv/l7-maps; 

参考：
GitHub:https://github.com/liuhuawu/data_visualization_cockpit
GeoJson:http://datav.aliyun.com/tools/atlas/#&lat=30.316551722910077&lng=106.68898666525287&zoom=3.5

附上代码：
archives1.component.html

<!-- archives1.component.html -->
<div class="head">
    <!-- header头部 -->
    <h1>档案管理数据驾驶舱</h1>
    <div class="weather">
        <span id="showTime">{{now|date:'yyyy-MM-dd'}} {{now|date:'HH:mm:ss'}}</span>
    </div>
</div>

<!-- 中部内容 -->
<div class="mainbox">
    <ul class="clearfix">
        <li>
            <div class="boxall">
                <div class="alltitle">2020各分院项目归档情况</div>
                <div id="container1"></div>
                <div class="boxfoot"></div>
            </div>
            <div class="boxall" style="height: 22rem;">
                <div class="alltitle">2020各分院项目小类</div>
                <div id="container2"></div>
                <div class="boxfoot"></div>
            </div>
        </li>

        <li>
            <div class="bar">
                <div class="barbox">
                    <ul class="clearfix">
                        <li>690</li>
                        <li>610</li>
                    </ul>
                </div>
                <div class="barbox2">
                    <ul class="clearfix">
                        <li style="color: white;">2020年总项目数</li>
                        <li style="color: white;">2020年已归档数</li>
                    </ul>
                </div>
            </div>
            <div class="map">
                <!-- <div class="map1"><img style="width: 80%;" src="../../../../assets/archives1/lbx.png"></div>
                <div class="map2"><img style="width: 75%;" src="../../../../assets/archives1/jt.png"></div>
                <div class="map3"><img style="width: 70%;" src="../../../../assets/archives1/map.png"></div> -->
                <div id="map4"></div>
            </div>
        </li>

        <li>
            <div class="boxall">
                <div class="alltitle">2020各分院年产值（百万）</div>
                <div id="container3"></div>
                <div class="boxfoot"></div>
            </div>
            <div class="boxall" style="height: 22rem;">
                <div class="alltitle">2020各月份归档/调晒情况</div>
                <div id="container4"></div>
                <div class="boxfoot"></div>
            </div>
        </li>
    </ul>
</div>

archives1.component.css

@font-face {
    font-family: electronicFont;
    src: url(../../../../font/DS-DIGIT.TTF)
}

@keyframes myfirst2 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(359deg);
    }
}

@keyframes myfirst {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-359deg);
    }
}

.head {
    height: 4rem;
    background: url(../../../../assets/archives1/head_bg.png) no-repeat center center;
    background-size: 100% 100%;
    position: relative;
    z-index: 100;
}

.head h1 {
    color: #fff;
    text-align: center;
    font-size: 1.5rem;
    line-height: 3rem;
}

.weather {
    position: absolute;
    right: 1rem;
    top: 0;
    line-height: .75rem;
}

.weather span {
    color: rgba(255, 255, 255, .7);
    font-size: 1rem;
    padding-right: .5rem;
    line-height: 2.6rem;
}

.mainbox {
    width: 100%;
    height: 100%;
}

li {
    list-style-type: none;
}

table {}

ol,
ul,
p,
h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0;
    margin: 0
}

.mainbox>ul {
    /* list-style: none; */
}

.mainbox>ul>li {
    float: left;
    width: 30%;
    padding: 0 .4rem;
}

.boxall {
    height: 14rem;
    border: 1px solid rgba(25, 186, 139, .17);
    padding: 0 .2rem .4rem .15rem;
    background: rgba(255, 255, 255, .04) url(../../../../assets/archives1/line.png);
    background-size: 100% auto;
    position: relative;
    margin-bottom: 2rem;
    z-index: 10;
}

.alltitle {
    padding: .4rem 0rem;
    font-size: 0.9rem;
    color: #fff;
    text-align: center;
    line-height: 1.6rem;
}

.allnav {
    height: calc(100% - 30px);
}

.bar {
    height: 8rem;
    background: rgba(101, 132, 226, .1);
    padding: .5rem;
    margin: 0rem .5rem;
}

.barbox {
    border: 1px solid rgba(25, 186, 139, .17);
    position: relative;
    height: 60%;
    margin: 1rem 2rem 0rem 2rem;
}

.barbox2 {
    margin: 0.4rem 2rem 0rem 2rem;
}

.barbox>ul,
.barbox2>ul {
    list-style: none;
}

.barbox li {
    font-size: 4rem;
    color: #ffeb7b;
    padding: .05rem 0;
    font-family: electronicFont;
    font-weight: bold;
}

.barbox li,
.barbox2 li {
    float: left;
    width: 50%;
    text-align: center;
    position: relative;
    z-index: 100;
}

.mainbox>ul>li:nth-child(1) {
    width: 30%;
    padding: 0;
}

.mainbox>ul>li:nth-child(2) {
    width: 40%;
    padding: 0;
}

.mainbox>ul>li:nth-child(3) {
    width: 30%;
    padding: 0;
}

.barbox:before,
.barbox:after {
    position: absolute;
    width: 2rem;
    height: .5rem;
    content: "";
}

.barbox:before {
    border-left: 2px solid #02a6b5;
    left: 0;
    border-top: 2px solid #02a6b5;
}

.barbox:after {
    border-right: 2px solid #02a6b5;
    right: 0;
    bottom: 0;
    border-bottom: 2px solid #02a6b5;
}

.barbox li:first-child:before {
    position: absolute;
    content: "";
    height: 50%;
    width: 1px;
    background: rgba(255, 255, 255, .2);
    right: 0;
    top: 25%;
}

.boxall:before,
.boxall:after {
    position: absolute;
    width: .5rem;
    height: .5rem;
    content: "";
    border-top: 2px solid #02a6b5;
    top: 0;
}

.boxall:before,
.boxfoot:before {
    border-left: 2px solid #02a6b5;
    left: 0;
}

.boxall:after,
.boxfoot:after {
    border-right: 2px solid #02a6b5;
    right: 0;
}

.map {
    position: relative;
    height: 30rem;
    z-index: 9;
}

.map1,
.map2,
.map3 {
    position: absolute;
    opacity: .5
}

.map1 {
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    z-index: 2;
    animation: myfirst2 15s infinite linear;
}

.map2 {
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    z-index: 3;
    animation: myfirst 10s infinite linear;
}

.map3 {
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.map1 img,
.map2 img,
.map3 img {
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
}

.clearfix:after,
.clearfix:before {
    display: table;
    content: " "
}

.clearfix:after {
    clear: both
}

.boxfoot:before {
    border-left: 2px solid #02a6b5;
    left: 0;
}

.boxfoot:after {
    border-right: 2px solid #02a6b5;
    right: 0;
}

.boxfoot {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
}

.boxfoot:before,
.boxfoot:after {
    position: absolute;
    width: 0.5rem;
    height: 0.5rem;
    content: "";
    border-bottom: 2px solid #02a6b5;
    bottom: 0;
}

archives1.component.ts

import { Component, OnInit } from '@angular/core';
import { Chart } from '@antv/g2';
import { DataSet } from '@antv/data-set/build/data-set';

//地图相关
import { Scene } from '@antv/l7';
import { ProvinceLayer } from '@antv/l7-district';
import { CityLayer } from '@antv/l7-district';
import { Mapbox } from '@antv/l7-maps';



@Component({
  selector: 'app-archives1',
  templateUrl: './archives1.component.html',
  styleUrls: ['./archives1.component.css']
})
export class Archives1Component implements OnInit {

  now: Date;

  //全局变量
  data1 = [
    { country: '未归档', year: '市政', value: 163 },
    { country: '未归档', year: '建筑', value: 203 },
    { country: '未归档', year: '规划', value: 276 },
    { country: '未归档', year: '交通', value: 408 },
    { country: '未归档', year: '园林', value: 547 },
    { country: '未归档', year: '水务', value: 729 },
    { country: '已归档', year: '市政', value: 502 },
    { country: '已归档', year: '建筑', value: 635 },
    { country: '已归档', year: '规划', value: 809 },
    { country: '已归档', year: '交通', value: 947 },
    { country: '已归档', year: '园林', value: 1402 },
    { country: '已归档', year: '水务', value: 3634 },
  ];

  data2 = [
    { name: '研究', type: '市政', value: 11 },
    { name: '咨询', type: '建筑', value: 10 },
    { name: '其他', type: '规划', value: 10 },
    { name: '专项', type: '交通', value: 14 },
    { name: '咨询', type: '园林', value: 7 },
    { name: '研究', type: '水务', value: 7 },
    { name: '其他', type: '市政', value: 14 },
    { name: '研究', type: '规划', value: 3 },
    { name: '其他', type: '水务', value: 3 },
    { name: '研究', type: '园林', value: 11 },
    { name: '咨询', type: '园林', value: 5 },
    { name: '研究', type: '建筑', value: 5 },
  ];

  data3 = [
    { type: '市政', value: 34 },
    { type: '建筑', value: 85 },
    { type: '规划', value: 103 },
    { type: '交通', value: 142 },
    { type: '园林', value: 251 },
    { type: '水务', value: 367 },
  ];

  data4 = [
    { month: '1月', city: '归档', temperature: 7 },
    { month: '1月', city: '调晒', temperature: 5 },
    { month: '2月', city: '归档', temperature: 7 },
    { month: '2月', city: '调晒', temperature: 4 },
    { month: '3月', city: '归档', temperature: 9 },
    { month: '3月', city: '调晒', temperature: 5 },
    { month: '4月', city: '归档', temperature: 14 },
    { month: '4月', city: '调晒', temperature: 8 },
    { month: '5月', city: '归档', temperature: 18 },
    { month: '5月', city: '调晒', temperature: 11 },
    { month: '6月', city: '归档', temperature: 21 },
    { month: '6月', city: '调晒', temperature: 15 },
    { month: '7月', city: '归档', temperature: 25 },
    { month: '7月', city: '调晒', temperature: 17 },
    { month: '8月', city: '归档', temperature: 26 },
    { month: '8月', city: '调晒', temperature: 16 },
    { month: '9月', city: '归档', temperature: 23 },
    { month: '9月', city: '调晒', temperature: 14 },
    { month: '10月', city: '归档', temperature: 18 },
    { month: '10月', city: '调晒', temperature: 10 },
    { month: '11月', city: '归档', temperature: 13 },
    { month: '11月', city: '调晒', temperature: 6 },
    { month: '12月', city: '归档', temperature: 9 },
    { month: '12月', city: '调晒', temperature: 5 },
  ];

  colors = ['#1A4397', '#2555B7', '#3165D1', '#467BE8', '#6296FE', '#7EA6F9'];

  initChar1(): void {
    // 计算每个柱子的占比
    const ds = new DataSet();
    const dv = ds
      .createView()
      .source(this.data1)
      .transform({
        type: 'percent',
        field: 'value', // 统计销量
        dimension: 'country', // 每年的占比
        groupBy: ['year'], // 以不同产品类别为分组
        as: 'percent',
      });

    const chart = new Chart({
      container: 'container1',
      autoFit: true,
      height: 180,
    });

    chart.data(dv.rows);
    chart.scale({
      percent: {
        min: 0,
        formatter(val) {
          return (val * 100).toFixed(2) + '%';
        },
      }
    });

    chart.tooltip({
      shared: true,
      showMarkers: false,
    });

    chart
      .interval()
      .position('year*percent')
      .color('country')
      .adjust('stack');

    chart.interaction('active-region');

    chart.render();
  }

  initChar2(): void {
    const ds = new DataSet();
    const dv = ds.createView();
    dv.source(this.data2).transform({
      type: 'percent',
      field: 'value',
      dimension: 'type',
      as: 'percent',
    });

    const colorMap = {
      市政: '#5B8FF9',
      建筑: '#61DDAA',
      规划: '#65789B',
      交通: '#F6BD16',
      园林: '#6F5EF9',
      水务: '#78D3F8',
    };

    const chart = new Chart({
      container: 'container2',
      autoFit: true,
      height: 350,
    });
    chart.data(dv.rows);
    chart.legend(false);
    chart.coordinate('theta', {
      radius: 0.5,
      innerRadius: 0.3,
    });
    chart.tooltip({
      showMarkers: false
    });
    chart
      .interval()
      .adjust('stack')
      .position('percent')
      .color('type', (val) => colorMap[val])
      .style({
        stroke: 'white',
        lineWidth: 1,
      })
      .label('type', {
        offset: -5,
        style: {
          fill: 'white',
          shadowBlur: 2,
          shadowColor: 'rgba(0, 0, 0, .45)',
        },
      });

    const ds2 = new DataSet();
    const dv2 = ds2.createView();
    dv2.source(this.data2).transform({
      type: 'percent',
      field: 'value',
      dimension: 'name',
      as: 'percent',
    });
    const outterView = chart.createView();
    outterView.data(dv2.rows);
    outterView.coordinate('theta', {
      innerRadius: 0.5 / 0.8,
      radius: 0.8,
    });
    outterView
      .interval()
      .adjust('stack')
      .position('percent')
      .color('type*name', (type, name) => colorMap[type])
      .style({
        stroke: 'white',
        lineWidth: 1,
      })
      .label('name', {
        offset: -10,
        style: {
          fill: 'white',
          shadowBlur: 2,
          shadowColor: 'rgba(0, 0, 0, .45)',
        },
      });

    chart.interaction('element-active')

    chart.render();
  }

  initChar3(): void {
    const chart = new Chart({
      container: 'container3',
      autoFit: true,
      height: 180,
    });
    chart.data(this.data3);
    chart.scale({
      value: {
        max: 400,
        min: 0,
        alias: '产值（百万）',
      },
    });
    chart.axis('type', {
      title: null,
      tickLine: null,
      line: null,
    });

    chart.axis('value', {
      label: null,
      title: {
        offset: 30,
        style: {
          fontSize: 12,
          fontWeight: 300,
        },
      },
    });
    chart.legend(false);
    chart.coordinate().transpose();
    chart
      .interval()
      .position('type*value')
      .size(16)
      .label('value', {
        style: {
          fill: '#8d8d8d',
        },
        offset: 10,
      });
    chart.interaction('element-active');
    chart.render();
  }

  initChar4(): void {
    const chart = new Chart({
      container: 'container4',
      autoFit: true,
      height: 300,
    });

    chart.data(this.data4);
    chart.scale({
      month: {
        range: [0, 1],
      },
      temperature: {
        nice: true,
      },
    });

    chart.tooltip({
      showCrosshairs: true,
      shared: true,
    });

    chart.axis('temperature', {
      label: {
        formatter: (val) => {
          return val + '个';
        },
      },
    });

    chart
      .line()
      .position('month*temperature')
      .color('city')
      .shape('smooth');

    chart
      .point()
      .position('month*temperature')
      .color('city')
      .shape('circle')
      .style({
        stroke: '#fff',
        lineWidth: 1,
      });

    chart.render();
  }

  async initMap() {
    const response = await fetch(
      'https://geo.datav.aliyun.com/areas_v2/bound/440000_full.json'

    );

    const result = await response.json();

    console.log(result.features[0].properties);

    const data = [];

    for (let i = 0; i < result.features.length; i++) {
      console.log(result.features[i].properties);

      let ft = {
        code: result.features[i].properties.adcode,
        name: result.features[i].properties.name,
        pop: result.features[i].properties.adcode
      };

      data.push(ft);
    }



    console.log(data);

    const scene = new Scene({
      id: 'map4',
      map: new Mapbox({
        center: [113.5502, 22.27],
        pitch: 0,
        style: 'blank',
        zoom: 3,
        minZoom: 3,
        maxZoom: 10
      })
    });
    scene.on('loaded', () => {
      new ProvinceLayer(scene, {
        data,
        joinBy: ['adcode', 'code'],
        adcode: ['440000'],
        depth: 2,
        label: {
          field: 'NAME_CHN',
          textAllowOverlap: false
        },
        fill: {
          color: {
            field: 'pop',
            values: this.colors
          }
        },
        popup: {
          enable: true,
          Html: props => {
            return `<span>${props.NAME_CHN}:</span><span>${props.pop}</span>`;
          }
        }
      });
    });

  }

  setTime(): void {

    this.now = new Date();
    setInterval(() => {

      this.now = new Date();

    }, 1000);
  }


  constructor() { }

  ngOnInit(): void {
    this.initChar1();
    this.initChar2();
    this.initChar3();
    this.initChar4();
    this.initMap();
    this.setTime();
  }

}
龚大龙
关注
专栏目录
ollama集成open-webui本地部署大模型应用
program哲学
04-26 1767
详细介绍如何利用ollama集成open-webui本地部署大模型应用
还在用代码苦苦调试驾驶舱？用这个神器1小时搞定
weixin_30888707的博客
07-10 972
最近和一位在政府交通部门工作的朋友聊天，谈到大数据应用，他们领导近几年对公共交通管理的数据信息化建设非常重视，特别是一些交通驾驶舱监控看板的应用。此前在面对这类数据大屏监控的可视化展示需求时，一般会由外包项目方通过代码等形式进行开发，然后经过美工不断优化调整，最终再交付到相关部门进行评审和上线。 通过这种方式，虽然一些很细节的样式需求也能够不断进行代码调优，但是带来的问题就是驾驶舱看板从需求收集...
大数据之保险行业的领导驾驶舱到底怎么做！附上模板
amsonga的博客
08-19 727
在信息化技术飞速发展的时代背景下，继互联网科技成果出现之后，又一技术变革以一种新的姿态登上历史舞台，那就是大数据的时代背景，而这种背景之所以能够在众多技术力量的较量下脱颖而出，最重要的是大数据以其自身独特的优越性名列前茅，对社会各阶层各行业都产生了深远的影响。而保险行业作为时代风浪中得以存活的挣扎的一份子，无疑给习惯了传统信息化时代模式下的行业带来了一定的不良影响。 因此，只有顺应科技信息化的发展要求，打造出能够适应经济行业规律的管理模式和实施程序，努力在时代的变化中求发展，才能更好的促进保险行业的发展，
WebUI与Comfyui：了解这篇文章就足够了！
最新发布
HJS123456780的博客
08-13 1264
AIGC技术的未来发展前景广阔，随着人工智能技术的不断发展，AIGC技术也将不断提高。未来，AIGC技术将在游戏和计算领域得到更广泛的应用，使游戏和计算系统具有更高效、更智能、更灵活的特性。同时，AIGC技术也将与人工智能技术紧密结合，在更多的领域得到广泛应用，对程序员来说影响至关重要。未来，AIGC技术将继续得到提高，同时也将与人工智能技术紧密结合，在更多的领域得到广泛应用。感兴趣的小伙伴，赠送全套AIGC学习资料和安装工具，包含AI绘画、AI人工智能等前沿科技教程，模型插件，具体看下方。
全面掌控！打造智慧城市建设的“领导驾驶舱”
华为云官方博客
07-11 1183
“领导驾驶舱”可在智慧屏、手机、电脑、平板等各类终端上使用，方便在外出路途中、办公桌、会议室都能方便地获得全面、实时、便捷、高效、优质的数据智能服务。
领导驾驶舱在企业中逐渐占领地位
明月说数据
12-13 314
随着信息化时代的来临，时间成本对于企业的重要性也越来越高，在重要时刻的及时反应甚至可以帮助企业获得更多的回报率，而使用领导驾驶舱也已经成为了企业管理者乐于见到的主流办公方式。 正如汽车驾驶需要仪表盘一样，企业经营管理也需要“驾驶舱”，及时为管理者提供所需要的数据以及预警的措施，从而保证正常高效的运营。除此之外，对于很多大型企业，领导驾驶舱的搭建不仅仅能够帮助决策，还可以跟外界展现企业能力，所以不少企业会将领导驾驶舱做成大屏放在接待中心。 什么是领导驾驶舱？ 领导驾驶舱（Management Cockpit
领导驾驶舱=管理驾驶舱？领导驾驶舱系统建设思路
明月说数据
12-14 5290
近期特别盛行领导驾驶舱，那么领导驾驶舱是什么，跟管理驾驶舱有什么异同吗 ？其实领导驾驶舱系统也称作“管理驾驶舱”系统，不同的叫法而已。 领导驾驶舱是以成型的指标体系及管理方法促进科技与业务的融合，精准高效落地管理驾驶舱应用。它会提供配置化直连或采集企业内外多种数据源，包括各类数据库、大数据平台、网络爬虫、FTP文件等功能，全方位满足用户基于数据的个性化业务场景定制及管理需求，满足用户对指标的管控、查询、分析等多样化场景。帮助用户随时随地掌握企业经营情况辅助决策，真正实现数据化运营的终极目标。 如何构建领导驾
领导驾驶舱如何助力领导做决策？
思迈特Smartbi
12-13 508
越来越多的企业向数字化转型，企业经营管理追求精细化和信息化，然而随着企业数据越来越庞大，且杂乱无章，分布零散，数据管理逐渐失控，大部分的企业都面临着一个难题：管理人员如何使用这些数据信息才可以把握公司动态，做出正确且重要的管理决策呢？ 有道是乱世出英雄，领导驾驶舱应势横空而出。领导驾驶舱是基于ERP的高层决策支持系统。通过详尽的指标体系，实时反映企业的运行状态，将采集的数据形象化、直观化、具体化，帮助管理者全局掌握企业实时运营状况，更精准地做决策，促进业务的发展。而Smartbi就可以做这样的领导驾驶舱。
HTML数据可视化驾驶舱项目案例源码.zip
05-22
HTML数据可视化驾驶舱项目案例源码，大数据可视化模板——echarts有关N个html界面。数据可视号图表案例集合项目源码。HTML数据可视化驾驶舱项目案例源码，大数据可视化模板——echarts有关N个html界面。数据可视号...
WEB协议——HTTP协议
01-08
WEB协议——HTTP协议 WEB协议——HTTPS 文章目录HTTP协议GET vs POSTPUTHEADDELETEcookieWWW的三项构建技术URI与URLHTTP报文HTTP状态码功能状态码的类别HTTP报文首部4种首部字段类型通用首部字段表Cache-...
Spark2.1.0——WebUI框架体系
beliefer的博客
11-20 1914
阅读建议：阅读本文前最好先阅读《Spark2.1.0——SparkUI的实现》一文。          Spark UI构建在WebUI的框架体系之上，因此应当首先了解WebUI。WebUI定义了一种Web界面展现的框架，并提供返回Json格式数据的Web服务。WebUI用于展示一组标签页，WebUITab定义了标签页的规范。每个标签页中包含着一组页面，WebUIPage定义了页面的规范。我们将...
大屏展示设计图，驾驶舱页面设计
03-05
大屏展示设计图，驾驶舱页面设计，PSD分层图片处理。
基于H5的管理驾驶舱
03-08
基于H5的管理驾驶舱，本系统仅支持IE10以上浏览器和Chorme、火狐等，效果不错 微立顶科技 FFner.com
Web开发驾驶舱.zip
04-09
个人收集数据可视化多种模板驾驶舱页面，实现大屏展示效果,实现数据可视化，大屏显示效果，用echarts插件实现,视觉体验,画面惊人,数据效果展示必备神器！
驾驶舱数据可视化前端源码20多套（含JS源码）.rar
04-01
驾驶舱数据可视化前端源码20多套（含JS源码）.rar
298套Html动态大屏可视化模板可视化动态驾驶舱大数据前端页面html+js+css动态页面模板
03-18
98套Html动态大屏可视化模板可视化动态驾驶舱大数据前端页面html+js+css动态页面模板
stable-diffusion-webui codeformer.pth
03-11
stable-diffusion-webui Restore faces Error 【https://github.com/AUTOMATIC1111/stable-diffusion-webui/issues/1513】 我认为这与损坏的安装有关。就我而言，我在“\models\Codeformer”上的 Codeformer.pth 已...
智慧城市大脑一网统管及领导驾驶舱项目建设解决方案
weixin_44094929的博客
05-26 637
一网统管与领导驾驶舱作为智慧城市建设的两大核心要素，共同推动了城市管理水平的提升。通过构建统一的管理平台，实现数据的集中管理和共享，以及利用领导驾驶舱进行数据可视化和分析，城市决策者能够更加科学、高效地制定和执行城市治理策略，推动城市持续、健康、协调发展。这种现代化的城市管理模式，对于提升城市竞争力、改善居民生活质量具有重要意义。
使用RHEL8主机的Web驾驶舱
idhfufh的博客
04-17 473
驾驶舱---RHEL8提供的通过浏览器来管理系统的Web页面 1)准备工作，安装驾驶舱的软件包： #yum -y install cockpit cockpit-dashboard cockpit-machines 2)启用驾驶舱服务: #systemctl enable cockpit.socket--now 3)使用驾驶舱: //注意在使用之前先将防火墙关闭:#systemctl disable firewalld --now(这将防火墙设为开机不自启，并立即关闭) ...
ArrayOS 6.5.2 WebUI管理指南
"ArrayOS APV 6.5.2 WebUI使用手册提供了Array网络用户界面的详细指南，帮助管理员高效管理Array设备，实现其最大性能。手册包括图形界面的功能模块介绍、基本配置步骤，以及与Array设备用户手册和CLI使用手册的配合...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

龚大龙

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值