Interact with graph on web page [closed] - javascript

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I want to plot a graph (diagram) on html pages, and the graph could consist of multiple nodes (sub-graph). When a user clicks a node, I need to display some textual message somewhere on the page. Is this can be done by some JavaScript plot library? A google search found:
Google Charts
ChartJS
DS.js
and more. Clearly, it can draw the photo for me, but my question is whether it can respond to user's action, i.e. a mouse click to display information for the graph. I have never used this and please share your knowledge.

you can try with d3.js. It is a good library to draw graphs.User interactions like mouse click also possible using d3.js

If you're a beginner, I'll advise you to use Chart.js or Chartist.js, the other ones being quite more complex to handle with (especially D3.js).
Your question is really really wide. If you want to be able to interact with user actions that happen within the graph, you should look at the events parts of their documentation and/or possible callbacks. A good example is in Chart.js when a user is over an element :
onHover Called when any of the events fire. Called in the context of the chart and passed an array of active elements (bars, points, etc)
You'll find many examples in their documentation and with a quick research through your favorite search engine.

Related

PDF annotation in browser and save to database [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed last month.
Improve this question
I would like direction on how to display the content of a PDF in the web browser and allow the user to annotate the content and save the position(coordinates) of the annotation in a database so it can be re-used when the page is reloaded.
Display the PDF is not an issue. However how do I go about drawing a circle or any other shape and save these annotations into a database?
I found some licensed products such as PDFTron but its very expensive.
I've been doing some research on this topic but it doesn't seems to be a very straight forward thing to do. Maybe I am missing something here.
Not concerned about the tech-stack here, javascript, node, ruby or python it doesn't matter. Even if the pdf will have to be converted to HTML or something else that is fine too. The end goal is to allow the user to annotate the content and save.
Can someone point me on the right direction to achieve this?
Thanks

Which web or browser technology is the best solution for my requirement? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I have a requirement to build a website where the user can choose a design from a standard template and a number of optional parts. So for example, it could be selecting an outfit, where there is a fixed template image of a person, and the user selects different colour trousers, shirts, socks etc from a scrolling list of images. When the user selects a particular item from the list, the image appears on the template giving an indication of the overall look.
It doesn't have to be too fancy with any moving images or transitions, but just the ability to overlay fixed images onto the template.
What would be my best choice of technology and way of going about it? Standard HTML? Css? Javascript? Something more server orientated such as JSP? Would appreciate any input.
You can solve it in many ways, it mostly depends on your requirements and what you're comfortable with doing.
Personally I would have done it with plain javascript based on the description you gave.
Requirements:
Change images during runtime.
JavaScript does a good job with this.
Predefined coordinates for where the overlay needs to be positioned.
Some type of storage for the coordinates, simplest possible would be hardcoded values in your script.
Ability to position the image as an overlay at said coordinates.
CSS with position: absolute; can be used for this.
Image stacking and index logic.
Can be done with JavaScript.
This is the simplest solution to the problem given. If you have more complex needs like zooming or resizing, you may want to check out <canvas>.

How do I plot points on a map using D3.js? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
Ok, before saying that this question is too "opinion based" and voting it down, hear me out. I have a geo visualization project in which I'm trying to plot air crash locations on a world map with a hover/mouse over function. I have a map ready. In fact I have two maps ready, a globe one and a flat one. I also have a CSV file with 5000 observations. They do not have longitudes and latitudes. How would I go about plotting the locations in the CSV onto the map?
I'm not looking for code, I'm asking the community for tutorials and ideas. If you can guide me to someone's blog or description or videos on how to do this, that will be awesome. Again, before down voting as "too broad" or "too opinion based" or as some other thing, please read the question again. If you still think the question isn't properly asked, throw in a comment and I'll edit it. Globe Map and Flat map with hover function
Here is a way to geocode your place names to latitudes and longitudes.
More importantly, do you really need D3.js for this? Is this just for practicing? If yes, then these video tutorials are a great place to start.
If not, and if you care about displaying information on hover, why not use a simple solution like CartoDB? It will serve your purpose pretty well. You can customize the colors, basemaps, tooltips, fonts and most other things you'd care about in a map.

Make whole page draggable [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I am not sure where to start with this or even what keywords to search for, so I am asking for someone to point me in the right direction. Here is what I am wanting.
I am wanting to make a webpage that can be dragged in all directions with different HTML elements in all directions and load new elements as you get close to the edges via AJAX. I am hoping to achieve this via Bootstrap or JQuery.
Any ideas on how to get the page draggable like that?
jQuery UI has a draggable method that would work for you, as long as you target the viewable area as the element to initiallize the plugin on. If you prefer a more lightweight approach you can use this plugin created by Chris Coyier.: https://css-tricks.com/snippets/jquery/draggable-without-jquery-ui/.
An example of it working in just 2 directions would be found in this SO thread as well: Scroll the page on drag with jQuery however the actual plugin being used in the demo supports all direction dragging - see the authors site: http://davetayls.me/jquery.kinetic/

Displaying an indoor building map with route tracing draw path to rooms [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I need to display a map of multi-level building on a website. This website will only be displayed on a PC in the foyer of this building.
I need to allow people to do a room search and then draw directions to the room on the map. I also need people to zoom and drag the map too.
I have watched the Google "Map your business, inside and out" video and can see a lot of that could be useful, but there is nothing there to be able to show directions from one room to another.
So before I spend a lot of time writing my own code using jQuery, I was wondering if anyone else has done something similar, or if anyone can suggest some good starting points?
I found really nice plugin that meets my requirements.
https://github.com/ucdavis/wayfinding

Categories

Resources