【问题标题】:Highcharts Scaling Graph IssueHighcharts 缩放图问题
【发布时间】:2011-08-25 15:59:22
【问题描述】:

我正在使用 Highcharts 创建图表:

http://dev.speechlink.co.uk/David/sixthiteration/home.php

但是,当缩放时,它似乎会切断图表右侧的一部分...我不完全确定为什么..?

这是我的代码:

jQuery:

chart = new Highcharts.Chart({
      chart: {
         renderTo: 'summarycontainer',
      },
      credits: {
        enabled: false
      },
      exporting: {
        enabled: false
      },
       title: {
        text: 'No. Entries Submitted This Month',
        style: {
             fontSize: 10
        }
      },      
      xAxis: {         
         lineWidth: 1,
         lineColor: '#999999',
         title: {
            text: 'x-axis' 
         }
      },
      yAxis: {
         title: {
            text: 'y-axis'
         },
     labels: {
        y: 2
     },
     lineWidth: 1,
         lineColor: '#999999',
         gridLineWidth: 1,
         gridLineColor: '#eaeaea', 
         startOnTick: false,
         showFirstLabel: false
      },
      tooltip: {
         shared: true               
      },
      legend: {
         enabled: false
      },
      plotOptions: {
      },
      series: [{
         type: 'scatter',
         name: '',
         data: [10, 20, 10, 20, 2, 3, 1, 9],
         lineColor:  '#f6a828',
         color: '#418ed6'
      }],
   });
});

在我的 HTML 中,我有一个 div 容器:

<div id = "summarycontainer" style="width: 250px; height: 250px"></div>

【问题讨论】:

    标签: javascript jquery html charts highcharts


    【解决方案1】:

    在上面的代码中你有:

    data: [10, 20, 10, 20, 2, 3, 1, 9],
    

    在页面的来源中是:

    data: [10, 20, 10, 20, 2, 3, 1],
    

    也许你认为情节砍掉了最后一个点?

    编辑: 添加:categories: ['', ''] 到您的xAxis

    xAxis: {         
             categories: ['', ''],
             lineWidth: 1,
             lineColor: '#999999',
             title: {
                text: 'x-axis' 
             }
          },
    

    在我看来,highcharts 中有一个错误。

    编辑 2:

    用于格式化工具提示(以下仅为示例!):

    tooltip: {
             formatter: function() {
                       return '<b>'+ this.series.name +'</b><br/>'+
                   this.x +': '+ this.y +'°C';
             }
          },
    

    【讨论】:

    • 您好,感谢您的回复。所以我添加了你的建议,它确实阻止了图表切断最后一点,但它使我的前两点的工具提示空白?关于页面源代码,我弄乱了代码 - 这不是错误。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-09-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多