Skip to content

Downloads #4

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Oct 9, 2018
Merged

Downloads #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f8f9707
WIP: downloading capability
keller-mark Oct 4, 2018
041e2ec
Refactored click/mouseover code
keller-mark Oct 9, 2018
File filter

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions examples-src/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@
:pMarginTop="10"
:pMarginLeft="120"
:pMarginRight="10"
:pMarginBottom="150"
:pMarginBottom="180"
>
<Axis
slot="axisLeft"
Expand Down Expand Up @@ -220,6 +220,7 @@ const xyDataContainer = new DataContainer(
xyData
);


// Initialize data
const getData = function(dataKey) {
switch(dataKey) {
Expand All @@ -231,8 +232,6 @@ const getData = function(dataKey) {
return rainfallDataContainer;
case 'xy_data':
return xyDataContainer;
default:
return {}
}
};

Expand Down Expand Up @@ -264,6 +263,7 @@ const xyXScale = new ContinuousScale(
[0, 50]
);


const getScale = function(scaleKey) {
switch(scaleKey) {
case 'sample_id':
Expand Down
1 change: 1 addition & 0 deletions examples-src/data/brca_12_exposures.json
View file
Open in desktop

Large diffs are not rendered by default.

5 changes: 2 additions & 3 deletions src/components/Axis.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -516,9 +516,8 @@ export default {

},
downloadAxis() {
console.log(saveSvgAsPng);
// TODO

let node = d3_select(this.axisSelector).select("svg").node();
saveSvgAsPng(node, this.axisElemID + ".png");
}
}
}
Expand Down
20 changes: 10 additions & 10 deletions src/components/plots/BarPlot.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -257,17 +257,21 @@ export default {
*/
const canvasNode = canvas.node();

const getDataFromMouse = (mouseX, mouseY) => {
// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
return colToNode[colString];
};

const debouncedTooltipDestroy = debounce(vm.tooltipDestroy, TOOLTIP_DEBOUNCE);
canvas.on("mousemove", () => {
const mouse = d3_mouse(canvasNode);
const mouseX = mouse[0];
const mouseY = mouse[1];

// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
const node = colToNode[colString];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.tooltip(mouseX, mouseY, node["x"], node["y"]);
Expand All @@ -283,11 +287,7 @@ export default {
const mouseX = mouse[0];
const mouseY = mouse[1];

// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
const node = colToNode[colString];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.clickHandler(node["x"], node["y"]);
Expand Down
20 changes: 10 additions & 10 deletions src/components/plots/MultiBoxPlot.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -372,17 +372,21 @@ export default {
*/
const canvasNode = canvas.node();

const getDataFromMouse = (mouseX, mouseY) => {
// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
return colToNode[colString];
}

const debouncedTooltipDestroy = debounce(vm.tooltipDestroy, TOOLTIP_DEBOUNCE);
canvas.on("mousemove", () => {
const mouse = d3_mouse(canvasNode);
const mouseX = mouse[0];
const mouseY = mouse[1];

// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
const node = colToNode[colString];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.tooltip(mouseX, mouseY, node);
Expand All @@ -398,11 +402,7 @@ export default {
const mouseX = mouse[0];
const mouseY = mouse[1];

// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
const node = colToNode[colString];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.clickHandler(node["x"]);
Expand Down
11 changes: 7 additions & 4 deletions src/components/plots/ScatterPlot.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -227,14 +227,18 @@ export default {
*/
const canvasNode = canvas.node();

const getDataFromMouse = (mouseX, mouseY) => {
const i = delaunay.find(mouseX, mouseY);
return data[i];
};

const debouncedTooltipDestroy = debounce(vm.tooltipDestroy, TOOLTIP_DEBOUNCE);
canvas.on("mousemove", () => {
const mouse = d3_mouse(canvasNode);
const mouseX = mouse[0];
const mouseY = mouse[1];

const i = delaunay.find(mouseX, mouseY);
const node = data[i];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.tooltip(mouseX, mouseY, node[vm.x], node[vm.y]);
Expand All @@ -250,8 +254,7 @@ export default {
const mouseX = mouse[0];
const mouseY = mouse[1];

const i = delaunay.find(mouseX, mouseY);
const node = data[i];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.clickHandler(node[vm.x], node[vm.y]);
Expand Down
20 changes: 10 additions & 10 deletions src/components/plots/StackedBarPlot.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -285,17 +285,21 @@ export default {
*/
const canvasNode = canvas.node();

const getDataFromMouse = (mouseX, mouseY) => {
// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
return colToNode[colString];
};

const debouncedTooltipDestroy = debounce(vm.tooltipDestroy, TOOLTIP_DEBOUNCE);
canvas.on("mousemove", () => {
const mouse = d3_mouse(canvasNode);
const mouseX = mouse[0];
const mouseY = mouse[1];

// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
const node = colToNode[colString];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.tooltip(mouseX, mouseY, node["x"], node["y"], node["c"]);
Expand All @@ -311,11 +315,7 @@ export default {
const mouseX = mouse[0];
const mouseY = mouse[1];

// Get the corresponding pixel color on the hidden canvas
const col = contextHidden.getImageData(mouseX * ratio, mouseY * ratio, scaledWidth, scaledHeight).data;
const colString = "rgb(" + col[0] + "," + col[1] + ","+ col[2] + ")";
// Look up the node in our map
const node = colToNode[colString];
const node = getDataFromMouse(mouseX, mouseY);

if(node) {
vm.clickHandler(node["x"], node["y"], node["c"]);
Expand Down
3 changes: 2 additions & 1 deletion src/components/plots/mixin.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,8 @@ export default {
// stub
},
downloadPlot: function() {
return document.getElementById(this.plotElemID).toDataURL("image/png");
let image = document.getElementById(this.plotElemID).toDataURL("image/png");
document.write('<img src="'+image+'"/>');
}
}
}