1. 程式人生 > 其它 >echart.js 和 chart.js 改變圓點大小

echart.js 和 chart.js 改變圓點大小

原連結:https://blog.csdn.net/qq_14993375/article/details/81611525

echart.js圓點

series : [
        {
            name:'零售額',
            type:'line',
            showSymbol: true,
            symbol:'emptyCircle',    //設定為實心點
            symbolSize: 20,   //設定實心點的大小
            animation: false,
            itemStyle: { //圓圈樣式
                borderWidth: 2,
                color:'#f60',
            },
            lineStyle:{//線條樣式
                width:5,
                color:'#f60'
            },
            data:[10, 12, 21, 54, 260, 830, 710]
        }
]

  

Demo:http://jsrun.net/YxgKp

api文件:http://echarts.baidu.com/api.html#echarts

chart改變圓點大小

"datasets": [
        {
            "label": "零售額",
            "data": [100, 200, 300, 250, 450, 280], 
            "fill": false, 
            "borderColor": "#f00",
            "pointBackgroundColor":"#fff",
            
"pointBorderColor":"#f00", "pointBorderWidth":2.5, "pointRadius":7, "lineTension": 0.1 } ]

Demo:http://jsrun.net/qxgKp

兩個外掛各有各的優勢和缺點,chart.js可以自適應,比較適合H5頁面,但是可以參考的文件比較少