vue里echarts的使用:畫餅圖和面積折線圖

vue里echarts的使用,我們要先安裝echarts,然后在main.js里引入:

//命令安裝echarts
npm i echarts//main.js里引入掛載到原型上
import echarts from 'echarts'
Vue.prototype.$echarts = echarts

最終我們實現的效果如下:
在這里插入圖片描述
在這里插入圖片描述
頭部標題這里我們封裝了一個全局公共組件common-header,代碼如下:

<template></

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/697451.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/697451.shtml
英文地址,請注明出處:http://en.pswp.cn/news/697451.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

qt 軟件發布(Windows)

1. 開發環境 QtCreator MSVC編譯器 2. 源碼編譯 生成release或者debug版本的exe可執行文件(x64或x86) 3. windeployqt 打包 ①左下角開始菜單欄找到QT的命令交互對話框&#xff0c;如下圖MSVC 2017 64-bit(根據第二步編譯的類型選擇64位或者32位)。 ②cd 切換到第二步可…

TCP/IP協議詳解

文章目錄 TCP/IP協議概述基于TCP/IP協議的應用工具協議協議的必要性 TCP/IP協議TCP/IP協議族協議的分層 傳輸方式的分類報文、幀、數據包等的區別TCP 和 UDP的區別 TCP/IP協議概述 TCP/IP&#xff08;Transmission Control Protocol/Internet Protocol&#xff09;是一組通信協…

《圖解HTTP》筆記2:http的構成

1&#xff0c;查看瀏覽器上面一個具體的http請求 瀏覽器地址欄輸入網址&#xff1a;https://news.baidu.com/ 使用瀏覽器的開發者工具&#xff0c;查看網絡中發送和接受的數據。 可以看到輸入一個網址&#xff0c;瀏覽器和服務器進行了很多的交互。&#xff08;綠色部分&#…

python + selenium/appnium

Selenium 的自動化原理: selenium 自動化流程: 自動化程序調用Selenium 客戶端庫函數&#xff08;比如點擊按鈕元素&#xff09;客戶端庫會發送Selenium 命令 給瀏覽器的驅動程序瀏覽器驅動程序接收到命令后 ,驅動瀏覽器去執行命令瀏覽器執行命令瀏覽器驅動程序獲取命令執行的…

ubuntu環境下openssl庫的簡單使用

安裝 sudo apt-get install libssl-devaes算法demo 編譯&#xff1a;gcc aes.c -lssl -lcrypto -o aes 運行&#xff1a;./aes #include<stdio.h> #include<stdlib.h> #include<string.h> #include<openssl/aes.h>#define AES_KEY_SIZE 128 // AES密…

UNI-APP_app跳轉企業微信客服對話

uniapp打包app&#xff0c;app里點擊客服&#xff0c;跳轉企業微信客服對話。為什么是企業微信&#xff1f;因為只有微信小程序才可以通過 button 的 open-type‘share’ 打開微信客服對話框&#xff08;微信客服要在公眾號平臺配置&#xff09; 1、appId獲取 &#xff08;1&a…

OJAC近嶼智能張立賽博士揭秘GPT Store:技術創新、商業模式與未來趨勢

> - [Look&#xff01;&#x1f440;我們的大模型商業化落地產品](https://www.airecruitas.com/aigc) >- &#x1f4d6;更多AI資訊請&#x1f449;&#x1f3fe;[關注](https://mp.weixin.qq.com/s/85qwuIydaaydMQz2g0rgMA) >- [Free三天集訓營助教在線為您火熱答疑…

C#_各式各樣的參數(引用參數、輸出參數、數組參數、具名參數、可選參數)

引用參數 值參數和引用參數的區別在于傳參時是否會創建參數副本&#xff1a;值參數不會創建副本&#xff0c;而引用參數會創建副本。 換言之&#xff0c;值類型參數的參數與實體之間無直接關聯&#xff0c;修改參數不會對實體產生影響&#xff1b;引用類型參數的參數與實體可視…

6.微格式

微格式 經典真題 知道什么是微格式嗎&#xff1f;談談理解。在前端構建中應該考慮微格式嗎&#xff1f; 微格式介紹 所謂微格式&#xff0c;是建立在已有的、被廣泛采用的標準基礎之上的一組簡單的、開放的數據格式。 具體表現是把語義嵌入到 HTML 中&#xff0c;以便有助…

通過SSH 可以訪問Ubuntu Desktop嗎?

你可以在 Ubuntu Desktop 上開啟 SSH 服務&#xff0c;以便其他機器可以通過 SSH 連接到你的服務器。以下是在 Ubuntu Desktop 上開啟 SSH 服務的步驟&#xff1a; 打開終端 (Terminal) 應用程序。 輸入以下命令安裝 OpenSSH 服務器&#xff1a; sudo apt-get update sudo ap…

多任務爬蟲(多線程和多進程)

在一臺計算機中&#xff0c;我們可以同時打開多個軟件&#xff0c;例如同時瀏覽網頁、聽音樂、打字等&#xff0c;這是再正常不過的事情。但仔細想想&#xff0c;為什么計算機可以同時運行這么多軟件呢? 這就涉及計算機中的兩個名詞&#xff1a;多進程和多線程。 同樣&#xf…

通信入門系列——鎖相環、平方環、Costas環

微信公眾號上線&#xff0c;搜索公眾號小灰灰的FPGA,關注可獲取相關源碼&#xff0c;定期更新有關FPGA的項目以及開源項目源碼&#xff0c;包括但不限于各類檢測芯片驅動、低速接口驅動、高速接口驅動、數據信號處理、圖像處理以及AXI總線等 本節目錄 一、鎖相環 1、壓控振蕩…

重磅!MongoDB推出Atlas Stream Processing公共預覽版

日前&#xff0c;MongoDB宣布推出Atlas Stream Processing公共預覽版。 在Atlas平臺上有興趣嘗試這項功能的開發者都享有完全的訪問權限&#xff0c;可前往“閱讀原文”鏈接點擊了解更多詳細信息或立即開始使用。 開發者喜歡文檔型數據庫的靈活性、易用性以及Query API查詢方…

使用k-近鄰算法改進約會網站的配對效果(kNN)

目錄 谷歌筆記本&#xff08;可選&#xff09; 準備數據&#xff1a;從文本文件中解析數據 編寫算法&#xff1a;編寫kNN算法 分析數據&#xff1a;使用Matplotlib創建散點圖 準備數據&#xff1a;歸一化數值 測試算法&#xff1a;作為完整程序驗證分類器 使用算法&…

js過濾取出對象中改變的屬性和值

朋友公司的面試題 &#xff0c;取出對象中被改變的屬性和值 const obj1 { a: 1, b: 2, c: 4 }; const obj2 { a: 1, b: 2, c: 5 }; 方法1 function testFun(obj1, obj2) {const diff {};const keys1 Object.keys(obj1);const keys2 Object.keys(obj2);const allKyes keys…

【深度學習】Gemini 1.0 Pro 如何讓chatGPT扮演stable diffusion的提示詞工程師

google也出了一個chatGPT&#xff0c;免費申請使用&#xff1a; https://aistudio.google.com/app/prompts/new_chat https://github.com/google/generative-ai-docs/blob/main/site/en/tutorials/rest_quickstart.ipynb 模型信息&#xff1a; $ curl https://generativelan…

SpringCloud(14)之SpringCloud Consul

我們知道 Eureka 2.X 遇到困難停止開發了&#xff0c;所以我們需要尋找其他的替代技術替代Eureka&#xff0c;這一小 節我們就講解一個新的組件Consul。 一、Consul介紹 Consul 是 HashiCorp 公司推出的開源工具&#xff0c;用于實現分布式系統的服務發現與配置。與其它分布式…

kali xrdp

Kali Linux 使用遠程桌面連接——xrdp&xfce_kali xfce桌面-CSDN博客 Ubuntu/Debian/Kali xrdp遠程桌面黑屏/空屏/無畫面解決辦法 - 知乎 (zhihu.com) sudo apt-get install xrdp -y sudo apt-get install xfce4 -ysudo systemctl enable xrdp --now systemctl status xrd…

中級.NET開發工程師面試經歷

文章目錄 前言面試題目&#xff08;只記錄了還記得的部分&#xff09;一.簡單說下.NETCORE的生命周期&#xff1f;二.C#如何保證在并發情況下接口不會被重復觸發&#xff1f;三.引用類型和值類型有什么區別&#xff1f;四.那怎樣能讓引用類型和值類型一樣&#xff0c;在賦值的時…

【Latex】TeXstudio編譯器選項修改

1、動機 編譯國科大博士畢業答辯論文latex時報錯 Package ctable Error: You must load ctable after tikz. 2、方法 經過搜索發現是因為這是中文模板&#xff0c;編譯的選項不對&#xff0c;需要從 PDFLaTeX 調整到 XeLaTeX。于是操作如下 1&#xff09;點擊選項 2&#xf…