I've been able to highlight different parts of a vis.js network by utilizing the mechanism shown in the vis.js documentation examples. However,I wonder if we can get the same sort of effect when images are used for representing network nodes -as opposed to basic node shapes- (a straightforward 'coloring' of the nodes, as in the examples, does not gray out the images).
I'm the developer of the vis.js network module. Unfortunately there is no shortcut here. You'll have to generate b&w images of your images and change the image option to the greyscale image.
Another idea is to use the opacity, that does work for the images. If you have any more questions, please post them on our github page. We get emails from the issues and we like to use that to keep track of questions.
Cheers!
Related
Struggling with an issue around LinkedIn downsizing images posted via their API. Hoping someone has some resources that might be able to assist?
When posting via LinkedIn's reach media share, as described here:
https://www.linkedin.com/help/linkedin/suggested/70781/image-specifications-for-your-linkedin-pages-and-career-pages?lang=en
https://learn.microsoft.com/en-us/linkedin/marketing/integrations/community-management/shares/rich-media-shares
It seems their API only supports a "1.91:1 ratio" (1200 x 627)
What's ironic about this is 1.91:1 looks terrible in the application.
So after some experimentation (forgive the bright green background, I was testing whether white padding was being added) I discovered that LinkedIn's native posting of images is actually a 1.5375:1 ratio when done within the application, which lo and behold... actually looks good within the application. Example:
So then naturally I try to post 1.5375 via the API and get these hideous gray bars on both sides:
Further, the API adds a crop factor to the overall height that is just simply not present when an image is added in the application natively. This example is a side-by-side of the exact same image... (left = posted via API) (right = posted natively on LinkedIn)
You can see how much better the native image looks.
Does anyone have any suggestions on how to resolve this issue?
Many thanks!!
I am looking for a tool or library that will allow me to generate a preview image for an equirectangular panoramic image. I am using the pannellum library [https://pannellum.org] to present panoramas, which works great. What I'd like to add, however, is a way to generate lightweight preview images to display on initial page load. I would like to have a small sized preview image that does not look warped. Does such a tool/library/script exist?
Thank you!
Dave
Some people like to convert panoramas to cube maps, which is a lot easier to google.
I've been looking at https://github.com/denivip/panorama, or also at https://stackoverflow.com/a/43469036/2471983 if you want a pure JavaScript approach (check out that entire question page for lots of info). Both of these will by default create all six cube faces; you can either edit them or just throw out the five extra faces.
Once you have this unprojected image, you can resize it using whatever utility you like.
How can you generate the codes like shown below:
I will assume you want to use an existing standard instead of attempting to invent your own encoder\decoder.
Any 2D barcode can be intentionally damaged for esthetics if you crank up the redundancy used for error correction. 2D barcodes are designed to survive a certain amount of damage. Placing an image in the center and rounding the corners are both considered damage from the perspective of the reader. For round corners you can't use a barcode with orientation dots in the corners, like QR. You must choose a format that is oriented with a marker in the middle like:
MaxiCode
https://en.wikipedia.org/wiki/MaxiCode
ShotCode
https://en.wikipedia.org/wiki/ShotCode
Aztec Code
https://en.wikipedia.org/wiki/Aztec_Code
Similarly, if you wanted to place an image in the center then you wouldn't want to use one that requires a bullseye for orientation, unless you can retain the bullseye somehow in your central image. To place an image in the center and also round the corners you need to get creative. In your first image there are four tracking dots around the image. In the second and third examples the company uses it's own logo as the orientation point.
The first code you show is a proprietary code made by Facebook. It is now no longer used by their products, but some sites, e.g. respond.io may allow you to create them and some regular QR code scanners may be able to read them.
The second code is a Snapchat code and can be made on their site directly when you log into your account. You can also do it the the app on your device using their support instructions within limits for success.
The third code is a Kik code and there is a blog post of how to make that possible by generating a key and then downloading the code image in the color of your choice. They have more posts about how to work with them.
With all that said and done, you could try a site (not affiliated) like QR Code Go to make regular QR codes that are a little fancy. Thank you. Good day.
As you know, Google Maps Drawing Library is easy to implement, but it gives very little control to the developer.
(Here is a sample of the library at use http://gmaps-samples-v3.googlecode.com/svn/trunk/drawing/drawing-tools.html )
I would like to change the default settings of drawing polygons in two ways:
first, I'd like to use another icon for the nodes connecting lines instead of the small square icon
second, I like to increase the clickable area around the initial node.
Do you know if it's possible to do these changes to the drawing library?
I appreciate your help.
It is not possible with the existing drawing manager functionality. Please go through the following issue in Google maps api issues
http://code.google.com/p/gmaps-api-issues/issues/detail?can=2&start=0&num=100&q=drawing%20library&colspec=ID%20Type%20Status%20Introduced%20Fixed%20Summary%20Stars%20ApiType%20Internal&groupby=&sort=&id=3760
Based on the design below, is it possible to create the map just using CSS? If so, how?
So as you can see, when you hover over a state the name will appear and change the color of the state. On clicking it will info below the map per state.
UPDATE 1:
Can it be done using absolute positioning, z-index and hover states on a button?
UPDATE 2:
With a slight tweak to the design, would it be possible to have a flat image for the map and plotting dot's on it for each state that would include a hover (using the same tab style as the image example)? Each dot being an image. Am I right in saying that the complication of the design is to highlight the right area when hovered? Therefore, just having a dot would solve it right?
I was interested in this too and found this example (USA) MAP if you look into the source code there is area for each state that look like <area onmouseover="show(this)" onmouseout="hide()" onclick="fform.tg.checked=false;togl()" shape="poly" coords="179,33,174,66,230,67,225,35,179,33,179,33" href="us-nd.html">. You can read more about and tags in W3C link. I think its the only way how to do this without flash or something... But it cant be done without a little JS. To get the coords, I would asume you just open your image in some editor that shows coords(gimp or something) and manually find them out...
No. If it had rectangular shapes yes but with a lot of work.
You really need javascript on this one.
You might want to try a Javascript mapping library - www.openlayers.org is the market leader (and free and open source).
You get your US state map in the right format (GML for example) then you can pretty much cut n paste from one of the openlayers examples. Hovering and clicking are handled by event functions. They can then do things like updating your info box below the map.
Note that if you want Alaska and Hawaii as in the picture and all you can find is a geographic state map, you might have to use a GIS to shift the features around. Quantum GIS is a free and open-source GIS that can do this for you. Help for that can be found on gis.stackexchange.com!
If you're willing to use javascript, jQuery more specifically, here is a nice plug-in/tutorial on how to do what it seems like you'd like to. http://playground.mobily.pl/jquery/mobily-map.html. It won't do the states exactly, but it will allow you to drop pins and such.
Update: This seems to be exactly what you're looking for: http://playground.mobily.pl/tutorials/building-an-interactive-map-with-raphael.html. It includes a rather indepth tutorial as well.
Here is another interactive US map I found myself: http://www.fla-shop.com/products/html5/united-states/us/ It is purely javascript with customizable popups.