Search code examples
teechart

Steema teechart html5 Javazript change view area


How can I change the view area for a graph.

I have this example below se code an image

The left axes goes from 0 to 10 because there is data from 0 to 10 , but I still would like to show only 4 to 9, almost like its zoomed.

Is it possible ?

<title>Graf TEST </title>
</head>
<script src="http://127.0.0.1/charts/js/teechart.js" type="text/javascript"> </script>
<script src="http://127.0.0.1/charts/js/teechart-extras.js" type="text/javascript"></script>
<script language="JavaScript">

function draw() {

var Chart1=new Tee.Chart("canvas"); 
Chart1.title.text="test";
Chart1.applyTheme("minimal");
Chart1.palette.colors[0] ="green";
Chart1.addSeries(new Tee.Line([]) ); 

var Series1 = Chart1.series.items[0];

Series1.marks.style="value";
Series1.marks.visible=true;

Series1.colorEach="no";

Series1.format.stroke.size=3;

Series1.pointer.visible=true;



Series1.data.values[0]=6;
Series1.data.labels[0] ="Okt";


Series1.data.values[1]=9;
Series1.data.labels[1] ="Nov";

Series1.data.values[2]=10;
Series1.data.labels[2] ="Dec";

Series1.data.values[3]=0;
Series1.data.labels[3] ="Jan";


Chart1.draw();Chart1.toImage("img");canvas.style.display="none";
}
</script>
<p>
<BODY onload="draw()">
<img id="img"><canvas id="canvas" width="800" height="400"></canvas>
</html>

enter image description here


Solution

  • You should do that manually setting axis minimum and maximum values, for example:

    Chart1.axes.left.setMinMax(4,9);