Is there way to restrict Shield UI pie charts via the Wicket API (although it's not clear that you can do this with the raw JavaScript API either) in such a way that only allows one slice to be selected at a time?
If there's no way to do this via the API, is it possible to intercept the shift click and transform it into a standard click before it gets processed by the Shield UI JS?
Thanks,
Chris
By default, the selection mechanism of the chart is single. This is demonstrated in the following example:
https://demos.shieldui.com/web/pie-chart/sliced-offset
Another option would be to disable the default selection and simply allow clicking and then try to set the .selected property of a the corresponding datapoint.
Seems there is no easy way to force selection of 0 or 1 slices at a time. Currently selecting while pressing the Shift / Ctrl keys will not unselect the other slices.
You might want to contact their support and ask their opinion/solution on your request.
After contacting the dev team, they have made changes to the Javascript and the Wicket API code to allow this to happen.
chart.getOptions().getSeriesSettings().getPie().setAllowMultiPointSelection(false);
Related
They want a 260px-wide highstocks chart! Understandably, this causes the range selector with its input controls to get written on top of itself. I see that I can disable the input controls but then I can't really see what range has been selected using the navigator.
Would I use an event to capture the range selected (in the rangeSelector or the navigator) and display it in a nearby control?
I'm using v1.3.9. Thanks for any suggestions.
yes you can absolutely do that.
Highcharts provide events for these
you can find them
xAxis -> events -> afterSetExtremes/setExtremes
These 2 events will help you to capture the new limits when the range is changed. You can have your javascript code and work on it.
api ref : http://api.highcharts.com/highstock#xAxis.events
you can find a worked out example along with some explanation in that link.
I hope this will help you.
I'm learning how to write a Chrome extension and have implemented a simple plugin described at : http://developer.chrome.com/extensions/getstarted
The plugin I'm attempting to write needs to perform provide an option to perform based on text the user has highlighted within the page. Can point me in the direction of how to achieve this as I cannot seem to find documentation. So for example in below screen shot the selected text by user (the text is selected by using mouse to drag over text) is greyed out :
So if user right clicks on selected text an extra option is displayed which performs an action based on selected text.
Can provide tutorials/or any points on how to implement this functionality ?
Take a look at this answer for an example of how to get text selection back to your background page, https://stackoverflow.com/a/2645306/897414
Here goes the related API you wanted: https://developer.chrome.com/extensions/contextMenus
i am currently developing a website(related to fitness) client wants to make a feature, that will allow user to select a workout plan based on the choices you pick from a slider similar to the one on this example.
What i'm trying to figure out if this can be done with CSS or would I need to implement JavaScript / jQuery ?
Any help with this problem is appreciated. I just need a nudge in the right direction of where to start.
Edit: i have found jQuery-Smart-Wizard that partially does what i want would i be able to manipulate this to have choices and load a certain page depending on the choice made?
CSS is design-related, as in colors, sizes, and layout. If you want conditional navigation, and to parse form data, you'll need to use jQuery/JavaScript to manipulate client side (optional), and some sort of server-side language such as PHP to manipulate the data and information.
I am writing a component for a web app which will display some html, and let me capture and manipulate the selection boundaries (of the text selected by the user). I have done this successfully (for Mozilla) with a simple div element using window.getSelection(). However, the browser selection API is different for IE.
If I were to use a textarea instead (for interacting with the selection api), is there a uniform API across the browsers? Then I would need to overlay a DIV on top of this to display the styled text, and presumably I'd need to manage the cursor etc...
Basically I want a rich text editor - but without editing. Does anyone have any advice on the best way to go about this, which is quick, simple and cross browser compatible. I don't want to spend ages reinventing the wheel...
(If anyone's interested - this is for an online xml editor. I capture the users selection on a html version of the xml doc and then send the selection offsets info to the server, where the real xml doc gets marked up).
Kind Regards
Swami
Using a textarea won't help: the API is not consistent there either. I'd suggest using IERange to get a consistent API for selections.
What I want to achieve is as follows:
For example, there is a symbol which represents a table on a web page, a user can drag this element to any place on the web page, when the user looses the cursor, a dialogue box will pop up to ask the user to input values of attributes, for example,the number of columns, the number of rows, after the input, the corresponding table will come out at the place where the user chose. Of course, the symbol which represents a table is still at the original place. It is like a web version of dreamweaver. How to do this with Javascript?
If your question is how to start researching this feature I'd start with:
JQuery to get started with fancy yet easy javascript functionality
JQuery UI: Draggable, Dialog, etc
To actually develop the feature, if you don't know where to start, start small. Create a very basic web page with maybe just an icon and a button and then write some javascript to do something minor like display a dialog and show the result. Slowly start adding things like dragging something around, etc.
The JQuery UI stuff has lots of demos that you can start out with as a base to start customizing.
Warning: The first time I hit the JQuery UI Demos page I wasted at least a couple of days playing with all their cool stuff. It's so easy because the source is right there and you can also see it working in the browser on the demo page.
Did you look at the jQuery UI demonstration pages? The simple photo manager demo contains all the major pieces you'll need: Dragging an item, handling the drop event, doing something custom on drop. The revert demo may also be of interest
Begin by defining the requirements of your project. Break it down into smaller tasks and milestones. Then some learning and research on what javascript and frameworks like jquery can provide. Also check for existing solutions or components that you may be able to use and reduce your development efforts.