社区首页 >问答首页 >更新海图Y轴线图引起垂直线

问更新海图Y轴线图引起垂直线
EN

Stack Overflow用户

提问于 2015-10-09 09:26:00

回答 1查看 478关注 0票数 0

我正在实现一个高图表线图，在这里，我需要能够拖动点以及更新我的图表的y轴。当我拖动一个点，然后更新y轴时，就会从原来的点绘制一条直线到拖动的位置：这是一张正在发生的事情的图片。。

我真的更喜欢没有所有这些垂直线，出于某种原因，它似乎是重复的点，因为我也得到了一些三角形在测试。它只是离开线，但实际上并没有更新的重点？为了更新我所做的图表：

planChart.yAxis[0].max = newValueY;
$('.actualPlansPlot').highcharts(planChart);

任何指导都将不胜感激！

下面是代码的其余部分：

var values = [...my values];
planChart = {
    chart: {
        renderTo: 'container',
        animation: false
    },
    title: {
        text: ''
    },
    xAxis: {
        categories: startDates,
        crosshair: true,
    },
    yAxis: [{ // Primary yAxis
        labels: {
            format: '{value}',
            style: {
                color: '#20709e'
            }
        },
        title: {
            text: 'title',
            style: {
                color: '#20709e'
            }
        },
    }],

    plotOptions: {
        series: {
            point: {
                events: {

                    drag: function (e) {
                        // Returning false stops the drag and drops. Example:
                        /*
                        if (e.newY > 300) {
                            this.y = 300;
                            return false;
                        }
                        */

                        $('#drag').html(
                            'Dragging <b>' + this.series.name + '</b>, <b>' + this.category + '</b> to <b>' + Highcharts.numberFormat(e.y, 2) + '</b>');
                    },
                    drop: function () {
                        $('#drop').html(
                            'In <b>' + this.series.options.id + '</b>, <b>' + this.category + '</b> was set to <b>' + Highcharts.numberFormat(this.y, 2) + '</b>');
                    }
                }
            },
            stickyTracking: false
        },
        column: {
            stacking: 'normal'
        },
        line: {
            cursor: 'ns-resize'
        }
    },

    tooltip: {
        shared: true
    },

    credits: {
        enabled: false
    },

    series: [{
        name: 'title',
        tooltip: {
            pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {point.y} ' + trainingPlan.unit + '</b><br/>'
        },
        data: values,
        //draggableX: true,
        draggableY: true,
        dragMinY: 0,
        style: {
            color: '#20709e'
        }
    }]
}
$('.actualPlansPlot').highcharts(planChart);

它非常接近于可拖点在线的例子。

javascript

highcharts

CDN&音视频通信出海专场

提供游戏出海、社交娱乐等方案，助力企业抢占出海市场

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-10-09 10:11:41

更新的

使用以下代码：

$(document).on('click', '#updateYScale', function(e) {
var yValue = $('#newYValue')[0].value;    
        var chart =  $('.actualPlansPlot').highcharts();
        chart.yAxis[0].update({               
        max: yValue             
    });

  chart.redraw();
  });