(amCharts) 데이터에 두 개의 서로 다른 접두사가있는 차트가 있습니다. 어떤 데이터에 어떤 접두어가 있는지 함수에 알리는 방법은 무엇입니까?

Question

아래 두 테이블에서 데이터를 가져 오는 amChart 차트가 있습니다 (코드는 from this SO answer으로 수정 됨). 각 테이블의 카테고리는 각기 다른 접두어로 시작합니다. 첫 번째 테이블은 (영업)으로 시작하고 두 번째 테이블은 (마켓)으로 시작합니다.

여기에 더 나은 그림에 대한 내 코드입니다 :

이 두 개의 테이블이 있고 그것이 내가 열/바에서 기반으로 적재 할 필요가, 열/막대 차트입니다 때문에 http://jsfiddle.net/uoxbm2d3/2/하는 테이블 또는 무엇 접두사가 있습니다. 따라서 (Sales)는 (Sales)와 쌓을 수 있습니다. 즉, 표 1의 데이터는 표 1 만 누적됩니다. 형제와 겹쳐서 만 나타나는 (Market)/Table 2와 동일합니다. 이런 식으로 뭔가 :

녹색/황색/오렌지 색상 표 1 (판매)에서이다; 파란색/자주색 색상은 표 2 (마켓)에서 가져온 것입니다.

어떤 그래프가 어떤 테이블에서 오는 지 함수에 알리는 방법이 있습니까? 아니면 어떤 데이터에 어떤 접두어가 있는지 함수에 알려주는 것일까 요? 당신의 새로운 그래프를 추가하고 오래된 것들을 제거 후에는 다음 그들을 통해 루프가 다시 처음을 찾아 제목으로 정렬 할 수 있습니다

function generateGraphsFromData(chart, chartData) { 
 
    //get the chart graph value fields as lookup table with a seen property set to false by default 
 
    //this will be used to determine what graphs need to be removed when looking at the data 
 
    var graphValueFields = chart.graphs.reduce(function(valueFields, graph) { 
 
     valueFields[graph.valueField] = 0; 
 
     return valueFields; 
 
    }, {}); 
 

 
    var removeValueFields = []; 
 

 
    //create an array of new graph value fields by filtering out the categoryField 
 
    //and the currently known valueFields. 
 
    var newGraphValueFields = []; 
 

 
    Object.keys(chartData[0]).filter(function(key) { 
 
     return key != chart.categoryField; 
 
    }).forEach(function(valueField) { 
 
     //if this is a new graph, add it to the list 
 
     if (graphValueFields[valueField] === undefined) { 
 
      newGraphValueFields.push(valueField); 
 
     } else { 
 
      //otherwise, set the seen flag to 1 
 
      graphValueFields[valueField] = 1; 
 
     } 
 
    }); 
 

 
    //for each new value field left over, create a graph object and add to the chart. 
 
    newGraphValueFields.forEach(function(valueField) { 
 
     var graph = new AmCharts.AmGraph(); 
 
     graph.title = valueField; 
 
     graph.valueField = valueField; 
 
     graph.balloonText = "<strong>[[title]]</strong><br /> Rp[[value]]"; 
 
     graph.id = valueField; //use the valueField as the ID for ease of removal 
 
     graph.type = 'column'; 
 
     graph.lineAlpha = 0; 
 
     graph.fillAlphas = 0.5; 
 
     graph.bullet = "none"; 
 
     graph.stackable = true; // disable stacking 
 
     chart.addGraph(graph); 
 
    }); 
 

 
    //loop through the graphValueFields lookup table and remove all graphs that were not seen when 
 
    //rescanning the data 
 
    Object.keys(graphValueFields).forEach(function(removeGraphValueField) { 
 
     if (graphValueFields[removeGraphValueField] === 0) { 
 
      chart.removeGraph(chart.getGraphById(removeGraphValueField)); 
 
     } 
 
    }) 
 
    }

Answer 1

여기

스크립트의 조각 일치하지 않는 접두사를 사용하고 그래프의 newStack 속성을 true로 설정하고 나머지 그래프에서는 false로 설정하십시오. 예를 들어 :

chart.graphs.sort(function(lhs, rhs) { 
    //sort by title, ensures that the sales (first table) data comes first 
    var lhsSalesIdx = lhs.title.indexOf('(Sales)'); 
    var rhsSalesIdx = rhs.title.indexOf('(Sales)'); 

    if (lhsSalesIdx !== -1 && rhsSalesIdx === -1) { 
     return -1; 
    } 
    else if (lhsSalesIdx === -1 && rhsSalesIdx !== -1) { 
     return 1; 
    } 
    else { 
     return lhs.title.localeCompare(rhs.title); 
    } 
    }); 
    var stackSet = false; 
    //find the first instance of the market row graph and set its newStack property to true 
    //while clearing out the others 
    for (var i = 0; i < chart.graphs.length; ++i) { 
    if (!stackSet && chart.graphs[i].title.indexOf('(Sales)') === -1) { 
     chart.graphs[i].newStack = true; 
     stackSet = true; 
    } 
    else { 
     chart.graphs[i].newStack = false; 
    }  
    } 

Updated fiddle -이뿐만 아니라 작동하려면 내가 새 그래프 루프 다시 true로 stackable을 설정할 수 있습니다.