ECharts의 맞춤 필드 이름

콘솔 앱을 디자인했습니다. 사용자는 보고서 위젯 (그래프 유형, 선, 파이 등 선택)을 작성하고 나머지 API 기능에 연결할 수 있습니다. 그런 다음 시스템은 나머지 보고서 데이터 (데이터 필드, 사용자 입력 화면 이름)를 보고서 위젯 및 관련 그래프로 바인딩합니다.ECharts의 맞춤 필드 이름

라이브 대시 보드 (보고서 위젯 포함)에 D3.js를 사용하고 있습니다. 그러나 D3.js는 동적 보고서 및 동적 아약스 데이터에 적합하지 않습니다. D3.js 구현은 차트마다 다르므로 highcharts, echarts와 같이 개발자에게 친숙하지 않습니다.

그러나 하이 차트, echart 및 기타 차트의 필드 이름은 구성 할 수 없습니다. Kendo에서 그것은 다음과 같이 수행 할 수 있습니다

series: [ 
    { field: "price" } 
    ]

는 HighCharts 또는 eCharts에서이 작업을 수행 할 수있는 방법이 있습니까. 또는 무료/오픈 소스를 선호하는 다른 차트 라이브러리를 제안 할 수 있습니까?

업데이트 : 더 이상 eChart를 사용하지 않습니다. C3.js는보다 안정적이며 사용하기 쉽습니다. C3.js 같은 문제가 있지만 지금은 사용자 지정 데이터 배열을 준비하고 작동합니다.

chart.graph.load({ 
    columns: [ 
     GetTextData(serieData, "x"), 
     SerializeDataWithSerieName("blabla", serieData) 
    ] 
}); 
.... 
function GetTextData(data, textToInsertStart) { 
    var result = []; 
    if (textToInsertStart) 
     result.push(textToInsertStart); 

    for (var i = 0; i < data.length; i++) { 
     result.push(data[i][MyTextFieldName]); 
    } 
    return result; 
} 
.... 
function SerializeDataWithSerieName(serieName, data) { 
    var result = []; 
    result.push(serieName); 
    for (var i = 0; i < data.length; i++) { 
     result.push(data[i][MyDataFieldName]); 
    } 
    return result; 
}

출처

2016-11-02 Fatih Çelik

당신은 데이터 필드를 수동으로 바인드하고 Highcharts/eCharts에서 유효한 구성 객체를 사용합니까? – morganfree

더 자세히 설명해 주시겠습니까? –

json을받은 후 차트 라이브러리에서 이해할 수있는 적절한 구성 객체로 파싱합니다. json을 구문 분석하는 방법은 json 구조와 데이터 시각화 방법에 따라 달라집니다. – morganfree

당신이 시리즈의 옵션을 설정할 수 있지만

은 자세한 내용은 아래 링크를 참조하여 일련의 유형에 관련이.

https://ecomfe.github.io/echarts/doc/doc-en.html#Series

series: [ 
    { name: "price" } 
    ]

시리즈에 대한 모든 일이 Echarts의 문서 더를 찾을 수있는 링크를 방문하시기 바랍니다에 대한 자세한 설명합니다.

출처

2016-11-02 12:40:36

시리즈의 이름 속성은 지정된 데이터 그룹의 텍스트입니다. json 데이터의 속성이 아닙니다. myJsonData.price 필드를 바인딩해야합니다. –

ECharts의 맞춤 필드 이름

답변

관련 문제