|
|
@ -571,7 +571,7 @@ function renderChartPropertyField(commonChartProperty) |
|
|
|
selElem.id=commonChartProperty.name; |
|
|
|
selElem.id=commonChartProperty.name; |
|
|
|
selElem.title=commonChartProperty.explanation; |
|
|
|
selElem.title=commonChartProperty.explanation; |
|
|
|
//selElem.style="width:50px";
|
|
|
|
//selElem.style="width:50px";
|
|
|
|
if(commonChartProperty.rendererUniquename=="") |
|
|
|
if(commonChartProperty.variableName=="") |
|
|
|
{ |
|
|
|
{ |
|
|
|
selElem.disabled="disabled"; |
|
|
|
selElem.disabled="disabled"; |
|
|
|
selElem.readonly="readonly"; |
|
|
|
selElem.readonly="readonly"; |
|
|
@ -590,7 +590,7 @@ function renderChartPropertyField(commonChartProperty) |
|
|
|
const textAreaElem = document.createElement("textarea"); |
|
|
|
const textAreaElem = document.createElement("textarea"); |
|
|
|
textAreaElem.cols="20"; |
|
|
|
textAreaElem.cols="20"; |
|
|
|
textAreaElem.rows=3; |
|
|
|
textAreaElem.rows=3; |
|
|
|
if(commonChartProperty.rendererUniquename=="") |
|
|
|
if(commonChartProperty.variableName=="") |
|
|
|
{ |
|
|
|
{ |
|
|
|
textAreaElem.disabled="disabled"; |
|
|
|
textAreaElem.disabled="disabled"; |
|
|
|
textAreaElem.readonly="readonly"; |
|
|
|
textAreaElem.readonly="readonly"; |
|
|
@ -608,17 +608,23 @@ function renderChartPropertyField(commonChartProperty) |
|
|
|
break; |
|
|
|
break; |
|
|
|
case "RANGE": |
|
|
|
case "RANGE": |
|
|
|
|
|
|
|
|
|
|
|
//Einfaches Texteingabefeld:
|
|
|
|
//Schieberegler:
|
|
|
|
const rangeElem = document.createElement("input"); |
|
|
|
const rangeElem = document.createElement("input"); |
|
|
|
rangeElem.type="RANGE"; |
|
|
|
rangeElem.type="NUMBER"; |
|
|
|
rangeElem.min=commonChartProperty.range_from; |
|
|
|
rangeElem.size=5; |
|
|
|
rangeElem.max=commonChartProperty.range_to; |
|
|
|
if(commonChartProperty.variableName=="") |
|
|
|
rangeElem.step=50; |
|
|
|
|
|
|
|
if(commonChartProperty.rendererUniquename=="") |
|
|
|
|
|
|
|
{ |
|
|
|
{ |
|
|
|
rangeElem.disabled="disabled"; |
|
|
|
rangeElem.disabled="disabled"; |
|
|
|
rangeElem.readonly="readonly"; |
|
|
|
rangeElem.readonly="readonly"; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* klappt noch nicht: |
|
|
|
|
|
|
|
rangeElem.type="RANGE"; |
|
|
|
|
|
|
|
rangeElem.min=commonChartProperty.range_from; |
|
|
|
|
|
|
|
rangeElem.max=commonChartProperty.range_to; |
|
|
|
|
|
|
|
rangeElem.step=50; |
|
|
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
|
|
|
rangeElem.title=commonChartProperty.explanation; |
|
|
|
rangeElem.title=commonChartProperty.explanation; |
|
|
|
rangeElem.name=commonChartProperty.name; |
|
|
|
rangeElem.name=commonChartProperty.name; |
|
|
|
rangeElem.id=commonChartProperty.name; |
|
|
|
rangeElem.id=commonChartProperty.name; |
|
|
@ -634,7 +640,7 @@ function renderChartPropertyField(commonChartProperty) |
|
|
|
const inpElem = document.createElement("input"); |
|
|
|
const inpElem = document.createElement("input"); |
|
|
|
inpElem.type="TEXT"; |
|
|
|
inpElem.type="TEXT"; |
|
|
|
inpElem.size=5; |
|
|
|
inpElem.size=5; |
|
|
|
if(commonChartProperty.rendererUniquename=="") |
|
|
|
if(commonChartProperty.variableName=="") |
|
|
|
{ |
|
|
|
{ |
|
|
|
inpElem.disabled="disabled"; |
|
|
|
inpElem.disabled="disabled"; |
|
|
|
inpElem.readonly="readonly"; |
|
|
|
inpElem.readonly="readonly"; |
|
|
@ -1007,7 +1013,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti |
|
|
|
var measureDim=document.getElementById("measure1").value; |
|
|
|
var measureDim=document.getElementById("measure1").value; |
|
|
|
var fontSizeDefault=getCommonChartProperty("fontSize")+"pt"; |
|
|
|
var fontSizeDefault=getCommonChartProperty("fontSize")+"pt"; |
|
|
|
var myCaption=getCommonChartProperty("chartCaption"); |
|
|
|
var myCaption=getCommonChartProperty("chartCaption"); |
|
|
|
var chartWidth=getCommonChartProperty("chartWidth"); |
|
|
|
var chartWidth=getCommonChartProperty("width"); |
|
|
|
var myFontFamily=getCommonChartProperty("font-family"); |
|
|
|
var myFontFamily=getCommonChartProperty("font-family"); |
|
|
|
var myBgColor=getCommonChartProperty("background-color"); |
|
|
|
var myBgColor=getCommonChartProperty("background-color"); |
|
|
|
var myColor=getCommonChartProperty("color"); |
|
|
|
var myColor=getCommonChartProperty("color"); |
|
|
@ -1019,10 +1025,10 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti |
|
|
|
|
|
|
|
|
|
|
|
for(var k=0;k < commonChartProperties.length;k++) |
|
|
|
for(var k=0;k < commonChartProperties.length;k++) |
|
|
|
{ |
|
|
|
{ |
|
|
|
if(commonChartProperties[k].name!="" && (commonChartProperties[k].groupUniquename=="STYLE"
|
|
|
|
if(commonChartProperties[k].variableName!="" && (commonChartProperties[k].groupUniquename=="STYLE"
|
|
|
|
|| commonChartProperties[k].groupUniquename=="LAYOUT")) |
|
|
|
|| commonChartProperties[k].groupUniquename=="LAYOUT")) |
|
|
|
{ |
|
|
|
{ |
|
|
|
stylesString+=",\""+commonChartProperties[k].name+"\":\""+getCommonChartProperty(commonChartProperties[k].name)+"\""; |
|
|
|
stylesString+=",\""+commonChartProperties[k].variableName+"\":\""+getCommonChartProperty(commonChartProperties[k].name)+"\""; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
@ -1090,22 +1096,38 @@ function makeBarX(chartDivElem,selectionRs) { |
|
|
|
var marksArray=new Array(); |
|
|
|
var marksArray=new Array(); |
|
|
|
if(fillDim=="") |
|
|
|
if(fillDim=="") |
|
|
|
marksArray[0]=Plot.barX(selectionRs, |
|
|
|
marksArray[0]=Plot.barX(selectionRs, |
|
|
|
|
|
|
|
Plot.sort("rownr",
|
|
|
|
{ |
|
|
|
{ |
|
|
|
x: measureDim,
|
|
|
|
x: measureDim,
|
|
|
|
y: categoryDim, |
|
|
|
y: categoryDim, |
|
|
|
|
|
|
|
|
|
|
|
fill: "blue" |
|
|
|
fill: "blue" |
|
|
|
}); |
|
|
|
}) |
|
|
|
|
|
|
|
); |
|
|
|
else |
|
|
|
else |
|
|
|
marksArray[0]=Plot.barX(selectionRs, |
|
|
|
marksArray[0]=Plot.barX(selectionRs, |
|
|
|
{ |
|
|
|
{ |
|
|
|
x: measureDim,
|
|
|
|
x: measureDim,
|
|
|
|
y: categoryDim, |
|
|
|
y: categoryDim, |
|
|
|
|
|
|
|
//sort: {y: "rownr"},
|
|
|
|
fill: fillDim |
|
|
|
fill: fillDim |
|
|
|
}); |
|
|
|
}) |
|
|
|
|
|
|
|
; |
|
|
|
|
|
|
|
|
|
|
|
var options= getChartOptions(categoryDim,measureDim,marksArray,false); |
|
|
|
var options= getChartOptions(categoryDim,measureDim,marksArray,false); |
|
|
|
|
|
|
|
/* var svgPlot=Plot.plot({ |
|
|
|
document.getElementById(chartDivElem).appendChild(Plot.plot(options)); |
|
|
|
y: { |
|
|
|
|
|
|
|
domain: d3.sort(selectionRs, d => -d.rownr).map(d => d.dimension1Value) |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
x: { |
|
|
|
|
|
|
|
grid: true |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
marks: [ |
|
|
|
|
|
|
|
Plot.barX(selectionRs, {x: measureDim, y: categoryDim}) |
|
|
|
|
|
|
|
] |
|
|
|
|
|
|
|
});*/ |
|
|
|
|
|
|
|
var svgPlot=Plot.plot(options); |
|
|
|
|
|
|
|
document.getElementById(chartDivElem).appendChild(svgPlot); |
|
|
|
} |
|
|
|
} |
|
|
|
function makeBarY(chartDivElem,selectionRs) { |
|
|
|
function makeBarY(chartDivElem,selectionRs) { |
|
|
|
var categoryDim=document.getElementById("viz_dimension1").value; |
|
|
|
var categoryDim=document.getElementById("viz_dimension1").value; |
|
|
@ -1145,11 +1167,12 @@ function makeLine(chartDivElem,selectionRs) { |
|
|
|
x: categoryDim, |
|
|
|
x: categoryDim, |
|
|
|
curve: "linear" |
|
|
|
curve: "linear" |
|
|
|
}); |
|
|
|
}); |
|
|
|
marksArray[1]=Plot.dot(rs, |
|
|
|
marksArray[1]=Plot.dot(selectionRs, |
|
|
|
{ |
|
|
|
{ |
|
|
|
y: measureDim,
|
|
|
|
y: measureDim,
|
|
|
|
x: categoryDim |
|
|
|
x: categoryDim |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
marksArray[2]=Plot.ruleY([0]); |
|
|
|
|
|
|
|
|
|
|
|
var options= getChartOptions(categoryDim,measureDim,marksArray,true); |
|
|
|
var options= getChartOptions(categoryDim,measureDim,marksArray,true); |
|
|
|
|
|
|
|
|
|
|
|