I would like to use Fotorama with Thumbnails on my webpage.
Is was looking at the coding but as it is rather complex I couldn't find what I need.
I would like to have the thumbnails in a separate div container and the pictures in another div container. This way I would be able to place them individually wherever I need them.
Is there a possibility to do so?
Related
I am doing a school project in which I have a floor layout svg that has each room in it's separate layer. I would like to assign an onclick function with some input data on each of these using map. I can't seem to figurate out how to do it though. I was told this is possible and from a game called Rival Regions which uses a clickable SVG map with each path having it's own data it seems possible but I just can't find any mentions on how to do it.
Example of how each path (or at least it seems it's the path doing it) is clickable and has it's own data about the state, region etc.
How to map the svg, how to feed it data / onclick handle. Anything that could help me or guide me in the right direction is appreciated!
I am not able to code the middle layout which is highlighted in pink circle
Layout I want
I want to make this layout in materialUi react
I am not sure about what you are asking, but I hope this will help you
there are different ways to do what you are trying to do, but I think it is important to maintain the correct grid order to do it.
Inside the pink circle seems to me that you are forgetting to wrap the card inside a grid item component, which would give you the possibility to align the cards in the way that you want.
I did a super easy example to better explain my point:
https://codesandbox.io/s/material-demo-forked-6ylvv
Inside the container you can also decide to align with direction="column" and using xs={6}.. this is up to you, in the Material-UI documentation you can find different ways, I suggest you to spend more time in it and remember always to use item inside the container
I have some questions about sliders,
Im using a slider and i want a marker to be present on it like:
http://1.bp.blogspot.com/-HDNFnyRU2Cw/TcuMbBaL70I/AAAAAAAAAGc/7eWN1qnZbAw/s1600/seek.JPG
it draws the image at the bottom of the slider, not on top of it, searched for a setThumbImagePosition or something like that ,but didnt find it, is there a way to use sliders with markers on the top of them?(like the image shown)
Is there a way to show divisions on the slider?(for example this)
https://raw.githubusercontent.com/channguyen/range-slider-view/master/screenshots/sc.png
Whats the best practice to create thicker sliders?
Check out this post notice that in order to create the stars effect properly we wrap the slider in a flow layout to prevent it from growing. You can use background images just like we do in the stars slider but you need to place the slider in a flow layout of similar layout that doesn't let it grow beyond its preferred size.
I am experiencing some delay in rendering part as my page contains lots of components like (inputs and labels etc). I have placed them in panelgridlayout.
I also used audit method in jdev there also found lots of time is taken by rendering.
So, I want to know which component will be the best or suitable for this. I also implemented panelGroupLayout (with horizontal and vertical) and panelfromlayout but has same slow rendering problem.
Please help me on this.
You need to check how many layout managers you have inside of others. Too many layout managers inside one another can affect render speed.
PanelGroup Layout is for taking a "small" island of content and making its contents horiz, vertical - like buttons or fields or even groups of other islands of content - or add scroll bars if needed, like for a table.
PanelGrid layout is designed to layout a "larger" area and give the layout a grid and allow you to place items almost exactly where you want it.
Some layout managers are designed to layout "the whole page" - like PanelStretch, PanelSlider and PanelGrid, while others are for specialized tasks or group of content, like PanelGroup, FormLayout, Tab, Accordion.
So, depending on the layout, using PanelGrid may mean you do not need the others, and can simply free position all the item which may speed up rendering.
That said, there are many variables that affect rendering speed, and the complexity of the items on the ADF Faces page is not the first thing we look at - The ADF Model layer, how that is implemented and how the data source is tuned (or not) can be a bigger source of impact on rendering.
You did not specify version, that would help as well.
Before PanelGrid we tended to use PanelStretch or PanelSlider as the main window layouts that laid out the main sections of the page - and put the other ones - panel group and formlayout inside it. With the advent of PanelGrid, some of this practice is no longer needed.
This, this and this may help as well.
I need to display many markers on a WPF image. The markers can be lines, circles, squares, etc. and there can be several hundreds of them.
Both the image source and the markers data are updated every few seconds. The markers are associated with specific pixels on the image and their size should be absolute in relation to the screen (i.e. when I move the image the markers should move along with it, but if i zoom in, they should take the same space of the screen as before).
Currently, I've implemented this using the AdornerLayer. This solution has several problems but the most significant one is that the UI doesn't fare well under the load even for 120 such markers.
I wanted to ask what would be the best way to go about implementing this? I thought of two solutions:
Inherit from Canvas and make sure it is invalidated not for every
added marker but for a range of markers at once
Create a control that holds an image and change its OnDraw to draw all the markers
I would appreciate some pointers from someone with experience with a similar problem.
Your use case looks quite specialized, so a specialized solution seems in order. I'd try a variant of your second option — extend Image, overriding its OnRender method.