如何强制Highcharts在Legend和Series中使用相同的符号?

时间:2015-02-05 09:19:17

标签: javascript highcharts

我尝试绘制具有特定符号的多个系列(Highcharts标准符号)。但是系列和传奇中的符号不​​匹配。在系列中它们被正确显示,但在传说中它们是随机的......

示例:http://jsfiddle.net/ogkh77r7/1/

$(function () {
    var chart = new Highcharts.Chart({
        "chart":{
        "zoomType":"xy", 
        "renderTo":"container"
    }, 
    "title":{
        "text":null
    }, 
    "subtitle":{
        "text":"text"
    }, 
    "xAxis":{
        "min": - 14, 
        "max":25, 
        "title":{
            "text":"text"
        }, 
        "tickPositions":[ - 14, - 10, - 5, 0, 5, 10, 15, 20, 25], 
        "plotLines":[{
            "color":"#C0D0E0", 
            "width":1, 
            "value": - 14}]
    }, 
    "yAxis":{
        "title":{
            "text":"text"
        }, 
        "min":0, 
        "max":967
    }, 
    "plotOptions":{
        "series":{
            "marker":{
                "enabled":true
            }
        }
    }, 
    "tooltip":{
        "shared":false, 
        "useHTML":true, 
        "formatter":null, 
        "style":{
            "border":"none !important", 
            "padding":"0px", 
            "font-size":"1em"
        }
    }, 
    "series":[{
            "type":"line", 
            "name":"s1", 
            "zIndex":20, 
            "data":[
                {"x": - 14, "y":560.944, "marker":{"symbol":"circle"}}, 
                {"x":15.333, "y":0, "marker":{"symbol":"circle"}}
            ]
        },{
            "type":"line", 
            "name":"s2",
            "zIndex":19, 
            "data":[
                {"x": - 14, "y":5.848, "marker":{"symbol":"circle"}}, 
                {"x":25, "y":5.848, "marker":{"symbol":"circle"}}
            ]
        },{
            "type":"scatter", 
            "name":"s3", 
            "zIndex":10, 
            "data":[
                {"x":0.8, "y":266.667, "marker":{"symbol":"circle"}}, 
                {"x":2.513, "y":242.857, "marker":{"symbol":"circle"}}, 
                {"x":1.675, "y":253.571, "marker":{"symbol":"circle"}}
            ]
        },{
            "type":"scatter", 
            "name":"s4", 
            "zIndex":9, 
            "data":[
                {"x":13.263, "y":35.119, "marker":{"symbol":"diamond"}}, 
                {"x":16.989, "y":13.021, "marker":{"symbol":"diamond"}}, 
                {"x":16.2, "y":9.375, "marker":{"symbol":"diamond"}}
            ]
        }, {
            "type":"scatter", 
            "name":"s5", 
            "zIndex":30, 
            "data":[
                {"x": - 14, "y":650.19492, "marker":{"radius":6, "symbol":"triangle"}}
            ]
        }, {
            "type":"scatter", 
            "name":"s6", 
            "zIndex":30, 
            "data":[
                {"x":15, "y":5.8, "marker":{"radius":6, "symbol":"triangle-down"}}
            ]
        }
        ], 
        "colors":["#2f7ed8", "#2f7ed8", "#b2b2b2", "#c4c4c4", "#f15c80", "#f15c80"]
    });
});

我在同一页面上使用Highcharts和Highstock,所以我需要使用highstock.js。使用highcharts.js无论如何都不能解决问题。

如果有人可以帮我解决这个问题会很奇怪,但我想这是Highcharts中的一个错误?

这么久, RaTm7

1 个答案:

答案 0 :(得分:9)

您必须在系列上设置标记定义,而不是数据。

    {
        "type":"scatter", 
        "name":"s4", 
        "zIndex":9, 
        "marker": {
            "symbol": "diamond"
        },              
        "data":[
            {"x":13.263, "y":35.119}, 
            {"x":16.989, "y":13.021}, 
            {"x":16.2, "y":9.375}
        ]
    }

http://jsfiddle.net/8ma4ts9s/