cari

Rumah  >  Soal Jawab  >  teks badan

javascript - echarts折线图如何将最后一段设置为虚线

已经试过了两种方法

方法一

通过设置两个折线图

series: [{
                    name: '月销售总额',
                    type: 'line',
                    stack: '总额',
                    symbol: "circle",
                    symbolSize: 10,
                    smooth: false,
                    /*lineStyle: {
                        normal: {
                            type: 'dashed'
                        }
                    },*/
                    itemStyle: {
                        normal: {
                            color: '#f77440',
                            label: {
                                show: true,
                                formatter: '{c}万',
                                textStyle: {
                                    color: '#6E6E6E',
                                    fontWeight: 'bold'
                                }
                            }
                        }
                    },
                    data: [moneys[0],
                        moneys[1],
                        moneys[2],
                        moneys[3], '-'
                    ]
                }, {
                    name: '月销售总额',
                    type: 'line',
                    stack: '总额',
                    symbol: "circle",
                    symbolSize: 10,
                    smooth: false,
                    lineStyle: {
                        normal: {
                            width: 2,
                            color: '#f77440',
                            type: 'dashed'
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: '#f77440',
                            label: {
                                show: true,
                                formatter: '{c}万',
                                textStyle: {
                                    color: '#6E6E6E',
                                    fontWeight: 'bold'
                                }
                            }
                        }
                    },
                    data: ['-',
                        '-',
                        '-',
                        '-', moneys[4]
                    ]
                }]

方法二

series: [{
                    name: '月销售总额',
                    type: 'line',
                    stack: '总额',
                    symbol: "circle",
                    symbolSize: 10,
                    smooth: false,
                    /*lineStyle: {
                        normal: {
                            type: 'dashed'
                        }
                    },*/
                    itemStyle: {
                        normal: {
                            color: '#f77440',
                            label: {
                                show: true,
                                formatter: '{c}万',
                                textStyle: {
                                    color: '#6E6E6E',
                                    fontWeight: 'bold'
                                }
                            }
                        }
                    },
                    data: [moneys[0],
                        moneys[1],
                        moneys[2],
                        moneys[3], {
                            value: moneys[4],
                            itemStyle: {
                                normal: {
                                    borderType: 'dashed'
                                }
                            },
                            lineStyle: {
                                normal: {
                                    type: 'dashed'
                                }
                            }
                        }
                       ]
                }
          ]

都是无法实现最后一段是折线。。

大家讲道理大家讲道理2790 hari yang lalu1241

membalas semua(1)saya akan balas

  • 天蓬老师

    天蓬老师2017-04-11 11:58:39

    参考这个

        series: [{      
                        name: '月销售总额',
                        type: 'line',
                        stack: '总额',
                        symbol: "circle",
                        symbolSize: 10,
                        smooth: false,
                        /*lineStyle: {
                            normal: {
                                type: 'dashed'
                            }
                        },*/
                        itemStyle: {
                            normal: {
                                color: '#f77440',
                                label: {
                                    show: true,
                                    formatter: '{c}万',
                                    textStyle: {
                                        color: '#6E6E6E',
                                        fontWeight: 'bold'
                                    }
                                }
                            }
                        },
                        data: [moneys[0],
                            moneys[1],
                            moneys[2],
                            moneys[3]
                        ]
                    }, {
                        name: '月销售总额',
                        type: 'line',
                        stack: '总额',
                        symbol: "circle",
                        symbolSize: 10,
                        smooth: false,
                        lineStyle: {
                            normal: {
                                width: 2,
                                color: '#f77440',
                                type: 'dashed'
                            }
                        },
                        itemStyle: {
                            normal: {
                                color: '#f77440',
                                label: {
                                    show: true,
                                    formatter: '{c}万',
                                    textStyle: {
                                        color: '#6E6E6E',
                                        fontWeight: 'bold'
                                    }
                                }
                            }
                        },
                        data: [,
                            ,
                            ,
                            , moneys[4]
                        ]
                    }]

    balas
    0
  • Batalbalas