echart 使用小結

Bmob 發布于2019-08-26 13:37 / 3654人閱讀

摘要：一隱藏特定類目有時候希望默認選中特定類目，取消選中特定類目，那么可以這樣做年年年只需要將不想顯示的項設置為即可。

一、legend 1、隱藏特定類目

有時候希望默認選中特定類目，取消選中特定類目，那么可以這樣做：

legend: {
    data: ["2011年", "2012年"],
    selected: {
        "2011年":false
    }
}

只需要將不想顯示的項設置為false即可。

2、設置圖標形狀

legend: {
    icon: "roundRect" // circle, 
}

詳情：https://www.echartsjs.com/opt...

二、series 1、曲線平滑：

series: [
    { smooth: true;}
]

2、去掉折線中的小圓點：

series: [
    {symbol: "none";}
]

匯總

option = {
    title: {
        text: "世界人口總量",
        subtext: "數據來自網絡"
    },
    tooltip: {
        trigger: "axis",
        axisPointer: {
            type: "shadow"
        }
    },
    legend: {
        data: ["2011年", "2012年"],
        selected: {
            "2011年":false
        }
    },
    grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
    },
    xAxis: {
        type: "value",
        boundaryGap: [0, 0.01]
    },
    yAxis: {
        type: "category",
        data: ["巴西","印尼","美國","印度","中國","世界人口(萬)"]
    },
    series: [
        {
            name: "2011年",
            type: "bar",
            smooth: true;
            symbol: "none";
            data: [18203, 23489, 29034, 104970, 131744, 630230]
        },
        {
            name: "2012年",
            type: "bar",
            symbol: "none";
            smooth: true;
            data: [19325, 23438, 31000, 121594, 134141, 681807]
        }
    ]
};

詳見demo（需自行添加設置）：https://echarts.baidu.com/exa...

持續更新中

GPU云服務器云服務器設計小結對象小結個人小結小結

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/109193.html

Webpack 3一些代碼體積優化方案的小結

摘要：表示生成一個懶加載的，只有當需要時才會被加載。主要是作用域提升，將所有模塊放在同一個作用域當中，一方面能提高運行速度，另一方面也能降低文件體積。前提是你的代碼是用模塊寫的。參考文章學習小結前言之前接手公司一個前端項目，開發了幾個月后越來越難以忍受項目結構的混亂和打包體積的臃腫（腳手架和基本功能代碼都是從公司的其他項目復制過來的），如果不立即進行重構，難以想象以后要怎么維護各個產品線...

taowen 2019-08-22 18:20 評論0 收藏0
ECharts 學習筆記01, 柱狀圖

摘要：編寫文件我們需要通過方法初始化一個實例然后通過方法繪圖。初始化實例設定圖表的配置項和數據柱狀圖銷量襯衫褲子襪子銷量顯示圖表小結以上就是使用進行繪圖的第一個例子。休息一下，馬上開始下一次學習目標使用 ECharts 繪制簡單的柱狀圖, 示例如下 showImg(https://segmentfault.com/img/bVbqkco?w=800&h=400); 搭建環境新建文...

KunMinX 2019-08-23 16:18 評論0 收藏0
ECharts 學習筆記02, 餅圖與南丁格爾圖

摘要：目標使用繪制餅狀圖并在此基礎上繪制南丁格爾餅圖示例如下搭建環境新建文件夾目錄結構如下編寫我們在中放入和分別用于顯示餅狀圖和南丁格爾圖編寫文件為了使和并列我們需要加上樣式編寫文件餅狀圖需要設置。目標使用 echarts 繪制餅狀圖, 并在此基礎上繪制南丁格爾餅圖, 示例如下 showImg(https://segmentfault.com/img/bVbqkV8?w=400&h=4...

張遷 2019-08-23 16:18 評論0 收藏0