Commit 334b3be6 authored by Maike Weber's avatar Maike Weber
Browse files

functional lane added with testing values in genome_viewer

parent 47f89e3d
......@@ -13,8 +13,10 @@ Vue.component("genome-viewer",{
<axis>
</axis>
<!-- TODO: lanes -->
<lane v-for="lane in lanes" :key="lane.id">
<svg :height="400" :width="1000">
<lane v-for="(lane, index) in lanes" :key="lane.id" :x="0" :y="100*index" :height="100" :width="1000">
</lane>
</svg>
<!-- TODO: features -->
<feature v-for="feature in featureData" :key="feature.name">
</feature>
......
Vue.component("lane",{
template:
`
<div class="gv-lane" @click="my_method()">
TODO: im the lane component
</div>
<svg :height="height" :x="x" :y="y">
<line :x1="x+10" :y1="height/2" :x2="width" :y2="height/2" stroke="#39FF14" stroke-width="2" stroke-dasharray="20, 5" />
</svg>
`,
props: {
todoprop1: {
x: {
validator (value) {
return true
}
},
todoprop2: {
y: {
validator (value) {
return true
}
}
},
height: {
validator (value) {
return true
}
},
width: {
validator (value) {
return true
}
},
},
methods: {
my_method(){
......@@ -24,9 +35,18 @@ Vue.component("lane",{
},
},
computed: {
Todo(){
return this.todo.charAt(0).toUpperCase() + this.todo.substr(1);
},
// y() {
// return y;
// },
// x() {
// return lib.map(0, this.o.xMin, this.o.xMax, 0, this.svg.w);
// },
// tickXs() {
// const ticks = lib.range(this.o.xMin, this.o.xMax, 10)
// return ticks.map(tick =>
// lib.map(tick, this.o.xMin, this.o.xMax, 0, this.svg.w)
// );
// },
},
data: function(){
return {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment