neo4j-contrib / neovis.js

Neo4j + vis.js = neovis.js. Graph visualizations in the browser with data from Neo4j.
Apache License 2.0
1.59k stars 324 forks source link

I was confused when I used your code.Do you have the document of option setting instead of some demos? #334

Closed liliComing closed 1 year ago

liliComing commented 1 year ago

Guidelines

Please note that GitHub issues are only meant for bug reports/feature requests. Before sending unsolicited pull requests, please open a feature request to discuss your proposal.

If you have questions on usage, please ask on the Discussion Forum instead of creating an issue here.

Feature description (Mandatory)

A clear and concise description of what you want to happen. Add any considered drawbacks.

Considered alternatives

A clear and concise description of any alternative solutions or features you've considered. Maybe there is something in the project that could be reused?

How this feature can improve the project?

If you can, explain how users will be able to use this and possibly write out a version the docs. Maybe a screenshot or design?

thebestnom commented 1 year ago

There us a d.ts file https://github.com/neo4j-contrib/neovis.js/blob/master/dist/neovis.d.ts And api docs with explainations https://neo4j-contrib.github.io/neovis.js/modules.html If there any way for making them clearer don't mind commenting here

thebestnom commented 1 year ago

https://neo4j-contrib.github.io/neovis.js/interfaces/LabelConfig.html For the label config

liliComing commented 1 year ago

However,exg.it didn’t work when I setting color.I use neovis in vite and init render successfully.please help me check out.

发自我的iPhone

------------------ Original ------------------ From: thebestnom @.> Date: Wed,Apr 5,2023 3:39 PM To: neo4j-contrib/neovis.js @.> Cc: liliComing @.>, Author @.> Subject: Re: [neo4j-contrib/neovis.js] I was confused when I used your code.Doyou have the document of option setting instead of some demos? (Issue #334)

https://neo4j-contrib.github.io/neovis.js/interfaces/LabelConfig.html For the label config

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

thebestnom commented 1 year ago

Can you please send your code or part of it so I could see how you are using it and what are you trying to do?

liliComing commented 1 year ago

ok import NeoVis from 'neovis.js/dist/neovis.js'; export default function () {     const executeCypher2 = (scenicList)=>{         let neoViz;         const config = {             containerId: "chart4",             neo4j: {                 serverUrl: "bolt://localhost:7687",                 serverUser: "neo4j",                 serverPassword: "qazwsxedc",             },             labels: {               scenic:{                 label: "scenic_name",                 color:{                     background:"red"                 }               },               user:{                 label:"name",                 color:"pink"               },               follow_people:{                 label:"follow_name",               },               tag:{                 label:"tag"               },               fan:{                 label:"fan_name"               },               relax_type:{                 label:"relax_type"               },               scenic_type1:{                 label:"category1"               },               scenic_type2:{                 label:"category2"               },               scenic_type3:{                 label:"category3"               },               city:{                 label:"city_name"               },               core_type:{                 label:"core_type"               },               province:{                 label:"province_name"               },               rank:{                 label:"scenic_rank"               },               scenic_rank:{                 label:"scenic_rank"               },                           },             relationships: {                 INTERACTS: {                     value: "weight"                 }             },             initialCypher: "MATCH p=(n:scenic)-[*..5]->(t)  where n.scenic_name='湖心亭' or n.scenic_name='华顶国家森林公园' or n.scenic_name='灵峰景区' and ALL(n1 in nodes(p) where size([n2 in nodes(p) where id(n1) = id(n2)])=1 )  RETURN p"         };

        neoViz = new NeoVis(config);         console.log(neoViz._config)         neoViz.render();     }     return { executeCypher2 } }

------------------ 原始邮件 ------------------ 发件人: "neo4j-contrib/neovis.js" @.>; 发送时间: 2023年4月5日(星期三) 下午4:18 @.>; @.**@.>; 主题: Re: [neo4j-contrib/neovis.js] I was confused when I used your code.Do you have the document of option setting instead of some demos? (Issue #334)

Can you please send your code or part of it so I could see how you are using it and what are you trying to do?

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

thebestnom commented 1 year ago

Mind fixing the comment? It's unreadable

liliComing commented 1 year ago

Ok,I simplify the code 

// import the Neovis
import NeoVis from 'neovis.js/dist/neovis.js';
export default function () {
    // package graph render as a function
    const executeCypher = ()=>{
        let neoViz;
        //config setting
        const config = {
            // dom id
            containerId: "chart4",
            // neo4j server
            neo4j: {
                serverUrl: "bolt://localhost:7687",
                serverUser: "neo4j",
                serverPassword: "qazwsxedc",
            },
            labels: {
                // "scenic" is one of Entity type
              scenic:{
                // show scenic name
                label: "scenic_name",
                // this prop dosen't work
                color:"red"
              },
              user:{
                label:"name",
                color:"pink"
              },
              follow_people:{
                label:"follow_name",
              }
              
            },
            relationships: {
            },
            // use CQL to get the data ,which means abstractly the path about nodes and their multi-layer Neighbor node 
            initialCypher: "MATCH p=(n:scenic)-[*..5]->(t)  where n.scenic_name='湖心亭' or n.scenic_name='华顶国家森林公园' or n.scenic_name='灵峰景区' and ALL(n1 in nodes(p) where size([n2 in nodes(p) where id(n1) = id(n2)])=1 )  RETURN p"
        };

        neoViz = new NeoVis(config);
        neoViz.render();
    }
    return { executeCypher }
}

------------------ 原始邮件 ------------------ 发件人: "neo4j-contrib/neovis.js" @.>; 发送时间: 2023年4月5日(星期三) 下午4:24 @.>; @.**@.>; 主题: Re: [neo4j-contrib/neovis.js] I was confused when I used your code.Do you have the document of option setting instead of some demos? (Issue #334)

Mind fixing the comment? It's unreadable

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

thebestnom commented 1 year ago

The problem is not the code, the problem is that your comment have weird chars

liliComing commented 1 year ago

The problem is not the code, the problem is that your comment have weird chars

sorry, i just used the email system to send,now switch the github

// import the Neovis
import NeoVis from 'neovis.js/dist/neovis.js';
export default function () {
    // package graph render as a function
    const executeCypher = ()=>{
        let neoViz;
        //config setting
        const config = {
            // dom id
            containerId: "chart4",
            // neo4j server
            neo4j: {
                serverUrl: "bolt://localhost:7687",
                serverUser: "neo4j",
                serverPassword: "qazwsxedc",
            },
            labels: {
                // "scenic" is one of Entity type
              scenic:{
                // show scenic name
                label: "scenic_name",
                // this prop dosen't work
                color:"red"
              },
              user:{
                label:"name",
                color:"pink"
              },
              follow_people:{
                label:"follow_name",
              }

            },
            relationships: {
            },
            // use CQL to get the data ,which means abstractly the path about nodes and their multi-layer Neighbor node 
            initialCypher: "MATCH p=(n:scenic)-[*..5]->(t)  where n.scenic_name='湖心亭' or n.scenic_name='华顶国家森林公园' or n.scenic_name='灵峰景区' and ALL(n1 in nodes(p) where size([n2 in nodes(p) where id(n1) = id(n2)])=1 )  RETURN p"
        };

        neoViz = new NeoVis(config);
        neoViz.render();
    }
    return { executeCypher }
}
thebestnom commented 1 year ago

You are trying to put static color in property mapping config, what you did tries to copy "red" property from the neo4j node to the graph node, what you want is advance config with static Add

import NeoVis, {NEOVIS_ADVANCED_CONFIG} from 'neovis.js/dist/neovis.js';
//...
scenic: {
  // Properties config
  [NEOVIS_ADVANCED_CONFIG]: {
   static: {
    color: "red"
   }
  }
 // More configs
liliComing commented 1 year ago

You are trying to put static color in property mapping config, what you did tries to copy "red" property from the neo4j node to the graph node, what you want is advance config with static Add

import NeoVis, {NEOVIS_ADVANCED_CONFIG} from 'neovis.js/dist/neovis.js';
//...
scenic: {
  // Properties config
  [NEOVIS_ADVANCED_CONFIG]: {
   static: {
    color: "red"
   }
  }
 // More configs

I try it again. It dose work and thank you very much,will give you a star. So, the line's color also do like that?

thebestnom commented 1 year ago

Yep, If the doc from doesn't help you don't hesitate to open a discussion 😄