CODEWITHSUNDEEP
javascriptamcharts
Hayk Aghabekyan
Hayk Aghabekyan

Reputation: 1087

amcharts.js - make guide lines visible, if values are too different

I need something like in the picture attached. I need something like thisPlease follow this fiddle

As you can see, I've added two guide lines, but they are not visible, as its values are bigger than graph values.. Is there any way, I can make them visible? Maybe there is some way to zoom chart out or something.. See my code bellow or in jsfiddle. Thanks,

var chart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
    "theme": "light",
    "dataDateFormat": "YYYY-MM-DD HH:NN",
    "dataProvider": [{
        "date": "2012-01-01",
        "value": 8
    }, {
        "date": "2012-01-02",
        "value": 10
    }, {
        "date": "2012-01-03",
        "value": 12
    }, {
        "date": "2012-01-04",
        "value": 14
    }, {
        "date": "2012-01-05",
        "value": 11
    }, {
        "date": "2012-01-06",
        "value": 6
    }, {
        "date": "2012-01-07",
        "value": 7
    }],
    "valueAxes": [{
        "axisAlpha": 0,
        "position": "left",
        "tickLength": 0
    }],
    "graphs": [{
        "bullet": "none",
        "valueField": "value"
    }],
    "categoryField": "date",
    "categoryAxis": {
        "parseDates": true,
        "axisAlpha": 0,
        "gridAlpha": 0.1,
    },
  "guides": [{
    "value": 25,
    "toValue": 25,
    "lineColor": "#CC0000",
    "fillAlpha": 1,
    "fillColor": "#CC0000",
    "label": "critical"
  }, {
    "value": 20,
    "toValue": 20,
    "lineColor": "#CCF000",
    "fillAlpha": 1,
    "fillColor": "#CCF000",
    "label": "normal"
  }]
});

Upvotes: 4

Views: 1077

Answers (1)

martynasma
martynasma

Reputation: 8595

The answer is a value axis setting includeGuidesInMinMax. Just set it to true and it will recalculate value axis scale to include all present guides:

"valueAxes": [{
  "axisAlpha": 0,
  "position": "left",
  "tickLength": 0,
  "includeGuidesInMinMax": true
}]

Here's your updated fiddle.

Upvotes: 3

Related Questions