I have a dojox line chart that's populated from an identifyTask. I'm pushing the results into an array, which is the input for my plot series. I'm having a hard time searching out documentation on this, but I was able to get pretty far along with some trial and error. The chart looks the way I want, except that the markers on the first and last values are cut off and I don't like the way it looks. I'm looking for a parameter I can put on the X axis to prevent this. Or maybe I need a better calculation to define the min and max on the axis so the markers fall a bit farther inside the very edge?My data has multiple years worth of information for each polygon. The layers in the service are named so the last 4 characters are always the year. I'm using an identify on the center of the polygon. This is my results handler
function getStatsHandler(results){//formats the results for line chart, then generates it
stats.length = 0;
yearList.length = 0;
rateList.length = 0;
var year;
domConstruct.empty("chartDiv");
for (i=0;i<results.length;i++) {
var lyrResult = results;
itemLength = lyrResult.layerName.length;
yearPos = itemLength - 4;
year = lyrResult.layerName.substr(yearPos, 4);
var rate = lyrResult.feature.attributes.RATE;
yearList.push({value: i+1, text:year});
rateList.push(parseFloat(rate));
};
rateList.sort(function(a,b){return a-b});
var maxVal = rateList[rateList.length -1];
maxVal = Math.round(maxVal);
var axisMax = (parseInt(maxVal/10)+1)*10;
var lineChart = new Chart2D("chartDiv", {
title: currentCounty + "</br>" + title + " Rates" ,
titlePos:"bottom",
titleGap: 12,
titleFont: "normal normal normal 13pt Arial",
});
lineChart.addPlot("default", {
type: "Lines",
markers: true,
hAxis: "x",
vAxis: "y"});
lineChart.addAxis("x", {
title:"Rates by Year",
titleOrientation:"away",
labels: yearList,
font: "normal normal normal 9pt Arial",
majorLabels: true,
minorTicks: false,
minorLabels: false,
microTicks: false });
lineChart.addAxis("y", {
title:rateNote,
vertical: true,
fixLower: "major",
fixUpper: "major",
min: 0,
max: axisMax,
minorTicks: false,
minorLabels: true});
//{vertical: true, min: 0, max: axisMax});
lineChart.addSeries("Series 1", rateList, {
stroke: { color: "red", width: 2 }
}
);
var tip = Tooltip(lineChart, "default", {
text : function(o) {
var yr = yearList[o.x].text;
var yrList = parseInt(yr) - 1;
return ( yrList +'<br>' + o.y );
}
});
lineChart.render();
}
Everything works in this code except for the cropped markers. Even the online examples for line charts look to have this problem too, but I'm hoping for a workaround anyway.