peterclemenko
commented
4 years ago This is the code https://gist.github.com/aoighost/635cc22493fedf1fea79eda82cdd898d
Closed peterclemenko closed 4 years ago
peterclemenko
commented
4 years ago This is the code https://gist.github.com/aoighost/635cc22493fedf1fea79eda82cdd898d
rcarcasses
commented
4 years ago Hi @aoighost, thanks for pointing this out. I'm not sure why this happens neither, but seems like a real issue, I'll keep it in mind. I'll let you know if I find a solution.
joshdvir
commented
4 years ago Faced the same issue today using Vue 2.6.6, upgrade to Vue 2.6.10 solved it.
peterclemenko
commented
4 years ago So upgrading to nuxt and vue latest, I now get errors on starting with the following:
3:21 error Parsing error: Unexpected token as well as stylus issues. Where it before was able to at least load, now it won't even load the server. I think something big broke.
1 | 2 | > 3 |
${def.data.id}"
✖ 1 problem (1 error, 0 warnings)
peterclemenko
commented
4 years ago that jumbled it, here's a pic https://imgur.com/a/es3MsCT
@joshdvir any chance you can share a working code snippet for how to load cytoscape?
@rcarcasses any chance you can make a code example in a demo folder that shows how to do it without using codepen or anything like that?
joshdvir
commented
4 years ago @aoighost Here is my code
<cytoscape
ref="cyRef"
:config="cyConfig"
v-on:mousedown="addNode"
v-on:cxttapstart="updateNode"
:afterCreated="afterCreated"
:preConfig="preConfig"
>
<cy-element
v-for="def in resources"
:key="def.data.id"
:definition="def"
class="node-background-img-2"
v-on:mousedown="deleteNode($event, def.data.id)"
:sync="true"
/>
</cytoscape>This is in data()
cyConfig: {
boxSelectionEnabled: false,
autounselectify: true,
style: [
{
selector: "node",
style: {
"background-color": "#666",
label: "data(name)"
}
},
{
selector: "edge",
style: {
width: 3,
"line-color": "#ccc",
"target-arrow-color": "#ccc",
"target-arrow-shape": "triangle"
}
},
{
selector: "#1",
css: {
"background-image": "/img/icons/IoT_Sensor_dark-bg.svg"
}
},
{
selector: ".node-background-img-2",
css: {
"background-image": "/img/icons/IoT_Windfarm_dark-bg.svg"
}
}
],
layout: {
name: "cose",
padding: 60,
randomize: true,
componentSpacing: 40,
},
},This loads without issues
peterclemenko
commented
4 years ago Thanks, I got it working as well. Had to redo the nuxt project because things were way out of date and needed migrating. There were some linter issues that needed fixing as well.
I'm trying to use the example code in nuxt from codepen and I'm having errors pop up in the console and it's refusing to render the graph. I have no idea what's going wrong here.
The errors are [Vue warn]: Injection "cy" not found
found in
--->
<Pages\knowledgegraph.vue> at pages\knowledgegraph.vue