Korzystanie z wykresu liniowego KendoUI, jak sprawić, by markery danych (kropki) stały kolor?

Question

Używam interfejsu Kendo do zamiany istniejącego wykresu. Muszę zminimalizować zmiany między wykresami. Czy ktoś wie, jak sprawić, by kropki na wykresie liniowym stały się solidne? Czy to możliwe, aby linia była cieńsza?

To jest mój obraz mojego wykresu:

Oto mój projekt jsFiddle jeśli chcesz grać z nim: http://jsfiddle.net/rodneyhickman/uMTnh/2/

Moje html wygląda następująco:

<div id='chart' ></div> 

Mój skrypt jQuery wygląda tak:

jQuery('#chart').kendoChart({ 
    title: { 
     text: "Overall Score out of 100", 
     align: "left", 
     font: "18px Arial, Verdana, sans-serif", 
     color: "#444" 
    }, 
    seriesDefaults: { 
     type: "line", 
     missingValues: "interpolate", 

    }, 
    legend: { 
     position: "bottom" 
    }, 
    tooltip: { 
     visible: true, 
     format: "{0}%" 
    }, 
    valueAxis: { 
     min: 70, 
     max: 85, 
     plotBands: [{ 
      from: 70, 
      to: 75, 
      color: "#EDF5FF"}, 
     { 
      from: 80, 
      to: 85, 
      color: "#EDF5FF"}] 
    }, 
    series: [{ 
     name: "Some Product", 
     color: "004990", 
     tooltip: { 
      visible: true, 
      template: "<b>Some Product</b><br/>Current Score: #= value #<br/>#= category # " 
     }, 
     data: [81.82, 81.82, 81.82, null, null, null, null, null, null, null, null, 70.42, 72.37]}, 
    { 
     name: "Some Market Segmemt", 
     color: "da7633", 
     tooltip: { 
      visible: true, 
      template: "<b>Some Market Segmemt</b><br/>Current Score: #= value #<br/>#= category # " 
     }, 
     data: [73.81, 73.52, 73.59, 73.49, 73.41, 73.51, 73.72, 73.27, 74.23, 73.99, 73.97, 73.83, 73.79]}], 
    categoryAxis: { 
     labels: { 
      rotation: -45, 
      step: 1, 
      skip: 0 
     }, 
     categories: ["Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", "Jan - 2012", "Feb", "Mar"] 
    } 
}); 

Każda pomoc zostanie doceniona.

Answer 1

W obiekcie serii Użyj znaczników: {tło: "# 004990"}, // Użyj swojego koloru tła.

Aby ustawić witd paska, użyj również właściwości width: 1.

Oto rozwiązanie jsfiddle można grać z: http://jsfiddle.net/rodneyhickman/uMTnh/3/

Oto obraz wynikowy:

Nowy skrypt jQuery wygląda następująco:

jQuery('#chart').kendoChart({ 
    title: { 
     text: "Overall Score out of 100", 
     align: "left", 
     font: "18px Arial, Verdana, sans-serif", 
     color: "#444" 
    }, 
    seriesDefaults: { 
     type: "line", 
     missingValues: "interpolate" 

    }, 
    legend: { 
     position: "bottom" 
    }, 
    tooltip: { 
     visible: true, 
     format: "{0}%" 
    }, 
    valueAxis: { 
     min: 70, 
     max: 85, 
     plotBands: [{ 
      from: 70, 
      to: 75, 
      color: "#EDF5FF"}, 
     { 
      from: 80, 
      to: 85, 
      color: "#EDF5FF"}] 
    }, 
    series: [{ 
     name: "Some Product", 
     color: "004990", 
     width: 1, 
     markers: { background: "#004990" }, 
     size: 2, 
     tooltip: { 
      visible: true, 
      template: "<b>Some Product</b><br/>Current Score: #= value #<br/>#= category # " 
     }, 
     data: [81.82, 81.82, 81.82, null, null, null, null, null, null, null, null, 70.42, 72.37]}, 
    { 
     name: "Some Market Segmemt", 
     color: "da7633", 
     width: 1, 
     markers: { background: "#da7633" }, 
     tooltip: { 
      visible: true, 
      template: "<b>Some Market Segmemt</b><br/>Current Score: #= value #<br/>#= category # " 
     }, 
     data: [73.81, 73.52, 73.59, 73.49, 73.41, 73.51, 73.72, 73.27, 74.23, 73.99, 73.97, 73.83, 73.79]}], 
    categoryAxis: { 
     labels: { 
      rotation: -45, 
      step: 1, 
      skip: 0 
     }, 
     categories: ["Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", "Jan - 2012", "Feb", "Mar"] 
    } 
});