在同一垂直线上对齐标签和标记(Highcharts)

时间:2015-12-17 06:19:53

标签: javascript jquery highcharts highstock

enter image description here

我想在第一个点(蓝色)的红色圆圈中添加一个破折号。可能吗? 这是我的代码

function graph(graph_id, value_array,tool_tip_title, max, min){
        $('#'+graph_id).highcharts({

            chart: {
                type: 'areaspline',
                backgroundColor:'transparent'
            },
            title: {
                text: false
            },
            xAxis: {
                type: 'datetime',
                labels: {
                    formatter: function() {
                       return moment(this.value).format("HH:mm:ss");
                   }
               }
           },
           yAxis: {
            title: {
                text: false
            },
            gridLineColor: 'transparent',
            labels:{enabled: true},
            gridLineWidth: 0,
            minorGridLineWidth: 0,
            min: min,
            max: max

        },
        tooltip: {
            shared: true
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            areaspline: {
                fillOpacity: 1
            },
            series: {
            tooltip: {
                dateTimeLabelFormats: {
                    second:"%A, %b %e, %H:%M:%S"
                }
            },
             marker: {
                fillColor: '#3D84B1',
                lineWidth: 2,
                lineColor: 'white',
                radius: 6

            }
        }
    },
    series: [{
        showInLegend: false,
        name: tool_tip_title,
        color: "#EC615F",
        data: value_array
    }]
});
}

我也尝试将startOnTick设置为true并将min设置为x轴的最小日期时间,但没有发生任何事情。

2 个答案:

答案 0 :(得分:1)

默认情况下,Highcharts计算一些不错的日期,有时第一个可能的标签/数据点不符合“漂亮的标签”算法。如果您想要显示特定标签,请使用xAxis.tickPositioner。在你的情况下,我认为你可以简单地添加两个额外的日期,如:

tickPositioner: function() {
  var tp = this.tickPositions;           // get default positions

  tp.splice(0, 1, this.min);             // replace first label
  tp.splice(tp.length - 1, 1, this.max); // replace last label

  return tp;
}

简单演示:http://jsfiddle.net/p98rggva/

答案 1 :(得分:0)

您可以根据最小数据使用startOnTick和min。

tar -xf mysql-connector-c++-1.1.5.tar.gz
cd mysql-connector-c++-1.1.5
cmake . -DMYSQL_CONFIG_EXECUTABLE=/usr/local/mysql/bin/mysql_config \
  -DMYSQL_LIB=/usr/local/mysql/lib/libmysqlclient.so
make
sudo make install