Question

[ 
{ "category": "Q12012", "value1": 31845935.15, "value3": 0.00 }, 
{ "category": "Q22012", "value1": 29674500.79, "value3": 0.00 }, 
{ "category": "Q32012", "value1": 30935441.96, "value3": 0.00 }, 
{ "category": "Q42012", "value1": 31748214.07, "value3": 0.00 }, 
{ "category": "Q12013", "value1": 36601910.60, "value3": 31051022.99 }, 
{ "category": "Q22013", "value1": 39663505.35, "value3": 32240016.86 }, 
{ "category": "Q32013", "value1": 39822373.03, "value3": 34737268.00 }, 
{ "category": "Q42013", "value1": 37821101.06, "value3": 36959000.76 }, 
{ "category": "Q12014", "value1": 47430411.67, "value3": 38477222.51 }, 
{ "category": "Q22014", "value1": 47493801.18, "value3": 41184347.78 }, 
{ "category": "Q32014", "value1": 0.00, "value3": 43141921.74 }
]

显示我的图表的图片是使用以下代码创建的。

如果我的数据值= 0，我怎能不显示？
表示如果我的data == 0.00，我不希望它在图表上绘制。我在哪里可以设置它们？
如何命名线条（橙色和黄色线条），我的x轴和y轴？

谢谢

          <!-- the chart code -->
          <script>
        var chart;

        // create chart
        AmCharts.ready(function() {

          // load the data
          var chartData = AmCharts.loadJSON('dataMainForecasting.php');

          // SERIAL CHART
          chart = new AmCharts.AmSerialChart();
          chart.pathToImages = "http://www.amcharts.com/lib/images/";
          chart.dataProvider = chartData;
          chart.categoryField = "category";
          chart.title = 'Hello';

          //chart.dataDateFormat = "YYYY-MM-DD";

          // GRAPHS

          var graph1 = new AmCharts.AmGraph();
          graph1.valueField = "value1";
          graph1.bullet = "round";
          graph1.bulletBorderColor = "#FFFFFF";
          graph1.bulletBorderThickness = 2;
          graph1.lineThickness = 2;
          graph1.lineAlpha = 0.5;
          chart.addGraph(graph1);

          var graph2 = new AmCharts.AmGraph();
          graph2.valueField = "value2";
          graph2.bullet = "round";
          graph2.bulletBorderColor = "#FFFFFF";
          graph2.bulletBorderThickness = 2;
          graph2.lineThickness = 2;
          graph2.lineAlpha = 0.5;
          chart.addGraph(graph2);

          // CATEGORY AXIS
          chart.categoryAxis.parseString = true;

          // WRITE
          chart.write("Quarter2");
        });

        json = json.filter(function(val) {
    return val !== 0;
  });

  </script>

这是我从

    mysql_select_db("test",$connect);

// Fetch the data
$query = "
  SELECT *
  FROM `table 5` ";
$result = mysql_query( $query );

// All good?
if ( !$result ) {
  // Nope
  $message  = 'Invalid query: ' . mysql_error() . "\n";
  $message .= 'Whole query: ' . $query;
  die( $message );
}

// Print out rows

// Print out rows
$prefix = '';
echo "[\n";
while ( $row = mysql_fetch_assoc( $result ) ) {
  echo $prefix . " {\n";
  echo '  "category": "' . $row['category'] . '",' . "\n";
  echo '  "value1": ' . $row['value1'] . ',' . "\n";
  echo '  "value2": ' . $row['value2'] . '' . "\n";
  echo " }";
  $prefix = ",\n";
}
echo "\n]";

// Close the connection
//mysql_close($link);
?>

Answer 1

最新答案

检查AmChart addLabel method

请参阅此工作Demo

我已经为两者添加了实现1）从图中删除零值和2）更改轴的标签。

<强> JS

//function prototype
addLabel(x, y, text, align, size, color, rotation, alpha, bold, url)

，其中

x - 水平坐标
y - 垂直坐标
文字 - 标签的文字
对齐 - 对齐（左/右/中）
尺寸 - 文字大小
颜色 - 文字颜色
旋转 - 旋转角度 alpha - 标签alpha
bold - 指定文本是否为粗体（true / false）
的网址

在原始问题发生变更之前，这是我的回答

您可以预先处理要输入图表api的数据，并删除零值的数据。这很容易，而不是试图修改图形api。

检查JSFiddle Demo

<强> HTML：

<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

<强> JS：

$(function() {
  var options = {
    chart: {
      renderTo: 'container',
      plotBackgroundColor: null,
      plotBorderWidth: null,
      plotShadow: false
    },
    title: {
      text: ''
    },
    tooltip: {
      formatter: function() {
        return '<b>' + this.point.name + '</b>: ' + this.percentage + ' %';
      }
    },
    plotOptions: {
      line: {
        allowPointSelect: true,
        cursor: 'pointer',
        dataLabels: {
          enabled: true,
          color: '#000000',
          connectorColor: '#000000'
        }
      }
    },
    events: {
      load: function() {
        var theChart = this;
        var theSeries = this.series;
      }
    },
    series: [{
      type: 'line',
      name: 'Browser share'
    }]
  };

    //though this is a simple array, you will use a real json object here
  json = [11, 71.5, 0, 0, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4];

  json = json.filter(function(val) {
    return val !== 0;
  });

  options.series[0].data = json;
  $('#container').highcharts(options);

});

所以基本上你需要将你的代码更改为：

$.getJSON("dataHome.php", function(json) {

    //now you need to remove the zeros
    json = json.filter(function(val) {
      return val !== 0;
    });
    options.series[0].data = json;
    chart = new Highcharts.Chart(options);
  });

您可以使用其键从json对象中删除元素，请参阅this Link

当数据= 0时，AmCharts不绘制图形

1 个答案: