I need to create a marker that looks completely different to the standard marker provided..this the code where I'm blocked..
pllz someone help me..
$(function () {
var data = [{ "semaine": "", "WindSpeed": 2, id: 0},{ "semaine": "semaine 01", "WindSpeed": 1, id: 1},{ "semaine": "semaine 02", "WindSpeed": 3, id: 2},{ "semaine": "semaine 03", "WindSpeed": 4, id: 3},{ "semaine": "semaine 04", "WindSpeed": 2, id: 4},{ "semaine": "semaine 05", "WindSpeed": 5, id: 5},{ "semaine": "", "WindSpeed": 3, id: 6}]; $("#chart").igDataChart({ width: "800px", height: "300px", dataSource: data, title: "", horizontalZoomable: true, verticalZoomable: false, windowResponse: "immediate", // leftMargin: 20, crosshairVisibility: "collapsed",
axes: [{ name: "xAxis", type: "categoryX", label: "semaine" }, { name: "yAxis", type: "numericY", maximumValue: 6, minimumValue: 0, title: "", interval: 1 }], series: [{ brush: { type: "linearGradient", colorStops: [ { color: "#dd1249", offset: 0 }, { color: "#ff6e49", offset: 0.2 }, { color: "#ffda56", offset: 0.5 }, { color: "#7cf26a", offset: 0.7 }, { color: "#3abe68", offset: 0.9 }], // optional: startPoint: { x: 0, y: 1 }, endPoint: { x: 0, y: 0 } // if start/endPoint are not specified, the default direction is top-bottom }, outline:"collapsed", areaFillOpacity: 10, name: "series1", type: "area", xAxis: "xAxis", yAxis: "yAxis", isHighlightingEnabled: true, isTransitionInEnabled: true, valueMemberPath: "WindSpeed", tooltipTemplate:"visible" }], }); });
Hi,
To draw a custom marker you need to handle the markerTemplate function, where you get the canvas context and can draw in it. You can check examples of drawing in the markerTemplate in our forum threads:
or the provided attachment.