Question

我使用具有6个系列的highcharts创建了一个图形。 3是列系列，3是样条线系列。样条线系列会碰撞或进入柱形图，因此需要在样条线系列中添加轮廓以更好地查看。试图为样条线系列添加边框颜色，但无法这样做。但是在柱状图中也可以实现。如果以前有人尝试过样条系列，请提供帮助。

plotOptions: {
        series: {
            borderColor: '#303030'
        }
    },

此bordercolor适用于列，但不适用于样条系列

列图 http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/column-bordercolor/

想为以下系列加上边框 http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-datalabels-box/

Answer 1

Highcharts中没有设置边框的功能，但不会丢失所有内容。

通过在每个行系列的基础上添加新的“伪”系列，并设置几个参数，可以实现所需的效果。最好的方式（在代码中）是async function getFixtures(leaguesArray) { let response; try { response = await pool.query("SELECT * FROM fixtures WHERE league_name = ANY ($1)", [leaguesArray])); } catch (e) { console.error('Error Occurred', e); } return response.rows; }函数，因此只需找到所有async function getFixtures(leaguesArray) { let response; const offset = 1; const placeholders = leagueArray.map(function(name,i) { return '$'+(i+offset); }).join(','); try { response = await pool.query("SELECT * FROM fixtures WHERE league_name IN (" + placeholders+")", leaguesArray)); } catch (e) { console.error('Error Occurred', e); } return response.rows; }类型的序列：

chart.events.load

然后，对找到的所有系列进行迭代，并创建新的系列，以便将line，相同的数据和chart: { events: { load() { var series = this.series.filter(elem => elem.type === 'line') } } }分别增加color: [color_you_want]和{{1} }，将无法通过鼠标访问，并且在图例中也不可见，如下所示：

marker.symbol

希望，对您有帮助。

实时示例： http://jsfiddle.net/yw2tb4nm/

API参考：

https://api.highcharts.com/highcharts/chart.events.load

https://api.highcharts.com/highcharts/series.line.marker.symbol

https://api.highcharts.com/highcharts/series.line.marker.radius

https://api.highcharts.com/highcharts/series.line.showInLegend

https://api.highcharts.com/highcharts/series.line.enableMouseTracking

高图中的样条曲线系列的轮廓或边框

1 个答案: