New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Can not make it work! #2
Comments
Can you post the code somewhere or give me a link to somewhere public it's hosted? It's getting parsed by the comment system. I will also need the images themselves. I'd be happy to take a look. I can see one thing wrong: $('#ksp-containerID').mapster('set', true, 'hoi12'); }); There is no area with id="hoi12", your areas have ids like "aTW01". Q. Do I need jquery UI? -- NO |
Thank you for your prompt response I already fix the area with the proper name here is the link |
In that link, the only problem is that jquery is not being loaded, the include: I made a local copy of that page and included jQuery and it seems to work fine. |
Thanks, It is really nice what you did with maphilight, your work is so much nicer and easy to use! Now I am back where I started! Like I mentioned before I had a project pretty much working with "maphilight" under SAFARI So here is what is happening I have two images with image maps with your plugin, they work perfect $(document).ready(function () {
}); function bldgSel(tofu)
} |
Sorry, Forgot to include a link! |
It looks like the problem is document.links which is not apparently supported in Internet Explorer 8. This is causing the script to crash before it even gets to the $.mapster line, which is why the map is not changing. In a local copy, I commented out the lines beginning with "document.links" and it worked fine. I would just use a jquery selector instead of the native javascript for each of these, e.g.
instead of |
Thank you I will have never found it in a million years! $('#largeksp').attr('href',largefile); Keep bugging you, with two more questions If I already have a image map assigned to the image with ID = ksp-containerID document.getElementById('ksp-containerID').useMap = ""; Is there an easy way to have a single area being selected, what I mean is if I have Ivan |
For your first question, actually, I don't think that you can can "unbind" imagemapster right now. Never really thought about that. It looks like the code you have above, binding to an image with no "usemap", would do nothing, any previous binding would still be in effect. This is a simple change, I'll update it shortly. For the 2nd question, I added an option in 1.0.7:
will cause only one area to be selectable at a time. I see that I did not update the documentation! So I'll take care of that too. But hang tight for a little while and I'll add a way to unbind it. |
I updated the source code with a new option (edited) to remove the mapster binding from an image. The zip has not been updated however so please download from the source repository. I'll update the download when I've tested thoroughly. |
Just tried it and it goes nuts, Here is the testing link: http://www.brickellrealty.com/tmapper1.html The moment it loads go to the bottom of the page, in the keyplan to the right document.getElementById("ksp").style.backgroundImage = newimage; |
That link isn't working. |
Oh... and I gave you bad information before, oops! The format is
Sorry about that |
Sorry missed a "-" |
Ok, just changed! You can try the link again So when I clicked on a unit, that unit area stays on, I though about unselecting it myself |
I pushed an update which does some better exception handling, and cleaned up some issues with unbind (e.g. if it wasn't already bound it didn't work before, now it works fine whether or not the image is bound).. So that works better now, but your code is still showing duplicate images on rollover. The problem has to do with the way you are switching image maps, I think. In the HTML, Also - I think you will want to use this code to unbind:
That leaves the existing state after unbinding, otherwise, it won't persist the selection since you are unbinding as soon as someone clicks on an area. So - try updating again, which should solve some problems, but I am not sure how to fix the issue with reusing the same image map, I think that's probably a bug that you will know how to fix. |
Oh by the way, I noticed there is a canvas in your html next to |
Ok, I will give a shot, I have not idea about this canvas, I explicitly do not create any canvases myself, I will look into it By the way I was looking at the documentation and could not see if there is a way to query the plugin Thanks |
Huh - maybe I was looking at post-rendering markup when I saw that canvas, I thought it was in the pure html I pulled down. But I don't see it now, no worries. To get currently selected areas.... um, ok, that's just hilarious. No there is no way! My use cases have always looked at the external list. I'll add that now, that is some oversight... |
I think I know what is happening after I unbind, the routine gets called again so I test if(document.getElementById('ksp-containerID').useMap == "") then I tried both of these, if($('#ksp-containerID').attr('usemap') == "") and if($('#ksp-containerID').attr('useMap') == "") Any suggestions? |
Pushed another update with method to get selections:
I'm not sure I understand what you're doing with that bit of logic regarding the I would just re-create the mapster for the needed images each time they click on something from the main image, after you set the You can re-bind Does any of that help? |
Hi, I cleanup and commented my code so I did not have to check for an empty useMap attribute but I added three alerts for troubleshooting - These are my two initial containers, they both have different imagemaps- Here is my init routine<script type="text/javascript"> $(document).ready(function () { $('#bldg-containerID').mapster({ isSelectable: true, singleSelect: true, mapKey: 'rel', listKey: 'name', fillColor: '78aed7', fillOpacity: 0.1, strokeColor: '185276', stroke: 1, showToolTip: false, areas: [{key: '2th', selected: true}], onClick: function (e) {bldgSel(e.key);} }); $('#ksp-containerID').mapster({ isSelectable: false, mapKey: 'rel', listKey: 'name', fillColor: '78aed7', fillOpacity: 0.2, strokeColor: '185276', stroke: 1, showToolTip: false, onClick: function (e) {toFloorPlans(e.key);} }); }); </script>
} |
The code got all screw-up, in here. anyhow the link is the same http://www.brickell-realty.com/tmapper1.html when you clicked on the right container to switch you will see the alerts with the residues that are being left right after Thanks |
Ugh somehow I got in a version mess somewhere, apparently i overwrote some changes in the last update I pushed out. I'm fixing it now. I can see exactly what's wrong... |
OK - sorry about that, somehow all the unbind fixes I made after the first push got lost when I added the Couple things: the way it is now you actually just want to use In my local version with the current imagemapster, everything seems to work, except that ksp & bldg have the same map when you drill into a specific unit. (The last alert you put in there shows this). You don't see any highlight effects on the right image, because the right image isn't bound, but what you will see is if you mouse over the right image (which shouldn't have any bindings at all at this level) it will highlight stuff on the left image. I think all you need to do now is remove the "usemap" from the right image when drilled down to an individual unit to solve this last issue. I also couldn't figure out how to get back out to the tower :) |
OK - i just pushed another minor change (jQuery chaining was broken on unbind). But if you pull after this comment, this change should be all you need to make it all work:
|
Just included the latest change, I was trying to implement the last thing, the bottom to get back to the building selector, the moment I try var it breaks! |
I have only done basic testing for "get' but it is passing tests from the latest push, so put the code up again and I can take a look. I didn't see anything on the test link from before (though everything else looks like it's working). |
Here is the link http://brickell-realty.com/tmapper1.html with the back button routine, I included a couple of alerts, to see if it was getting there or not and to show that it did not pass. Click on any of the units in the right container, right after the back button will appear besides the enlarge "+" button
|
There's no mapster assigned to the right image at the point you are issuing the "get" - I think what you want to do is capture the selected key from
Then in
These changes make it show the main building again, though it still doesn't work completely because there are some other bugs (and I don't understand that part of your code enough). But you can probably figure it out from there. |
Thanks again, first you were right I was trying to do a 'get' from the wrong container and I am working things from there. I have a suggestion: What if when selecting 'singleSelect: true;' you could actually do something like |
If I understand you correctly, what about a flag to prevent "unselecting" things? So to generalize that idea, if you did not have "single select" set, then it would only allow you to add new selections. If you did have single select set, then it would mean only one item could ever be selected. (If you had no default selection, then it would mean the only time zero items could be selected would be before they clicked anything). Does that sound right? Seems useful, I can probably add that easily. I want to catch up on the tests for what I've done in the last couple days before actually releasing the current version, but i ought to be able to add that today. By the way I appreciate this interaction, you're using the tool in a ways that I hadn't thought of (or tested) so it's nice to have a chance to push it a little bit, it will be better & more stable for the exercise. |
Hey, it has been my pleasure working with you. By now your product has evolved into more than just a simple plugin but into a full fledge product and a hell of a good one! (excuse my language) and yes, that is exactly what I meant! |
Hi Jamie, I finished the back button routine and been beating myself to death testing it out, I believe the routine is ok but I may be wrong! You can check it out and see that it basically works but there are residues being left. Please take a look at it. I am so excited I have been trying to do this type of functionality for years without flash and wow it is so close. I am very grateful for your help. Thanks, Ivan |
I'll take a look shortly. I just pushed up another update, there are a few bug fixes, so you can try that, but I will also look at your current dev version. Also added a new option
When set to "true" at the global level, nothing can be deselected by the user. So if you combine this with There is one more new option that you may or may not need, it's this:
where options is the same as options passed initially. This is used to refresh an existing mapster with updated options, e.g. if you wanted to change the "isSelectable" state of something. If there are default settings in "options" for a state they will be applied immediately as well. I will update the docs later today. |
I pulled down your latest version and, using the version of imagemapster I just pushed, it seemed to work perfectly! I think I must have caught whatever bug was tripping you up when I updated all the tests. Let me know if it's working for you now. |
Hi, just downloaded the new plugin and replace all "isSelectable" with "isDeselectable:false" everything works perfect under Safari, Firefox and Chrome but not in IE8 & IE9 it seems like the isDeselectable is not working right I started looking around and decided just in case to replace all the "document.getElementById('bldg-containerID').useMap = bldgcontainermap;" with the equivalent in jquery "$('#bldg-containerID').attr({ useMap: bldgcontainermap });" but it didn't do anything. (screwballs to IE!) Any suggestions? |
Argh. I can see there's some singleSelect problem in IE, looking into it now. |
All right! I found the problem, have tested it in IE6, IE7 and IE9 (I can't easily test in 8, but it's not often things that work in 6&7 don't work in 8) and everything seems copacetic. Pull down the latest code and try it again. |
Yes, it seems it is working now, I am preparing for a final release myself so now that everything seems to be working I am going to do some heavy duty testing. I am going to check my whole code again to see if I can simplify. Again and again I can not tell you how grateful I am for your help, you are a very talented developer not only good writing code but understanding other people necessities. I will keep you posted. Thanks a million! |
Great! If you don't mind, let me know when it's online, I'd like to link to it as an example. |
Hi,
I pretty much had a complete project working with maphilight until I found yours and decided to give a shot.
Well to my disdain I have not been able to make it work not even once!
Questions
Thanks in Advanced, Ivan
Here is my code!
{{{
<title>Untitled Document</title> <script type="text/javascript" src="jscss/jquery-1.5.2.js"></script> <script type="text/javascript" src="jscss/jquery-ui-1.8.12.custom.min.js"></script> <script type="text/javascript" src="jscss/jquery.imagemapster.js"></script> <STYLE TYPE="text/css"> #ksp { display: block; background-image: url('images-epic/ksp.jpg'); background-color: transparent; background-repeat: no-repeat; width: 460px; height: 495px; } .sprite-tw { background-position: -920px 0px; } </STYLE> <script type="text/javascript"> $(document).ready(function () { $('#ksp-containerID').mapster({ isSelectable: true, mapKey: 'id', listKey: 'name', fillColor: '78aed7', fillOpacity: 0.5, stroke: 1, showToolTip: false }); $('#ksp-containerID').mapster('set', true, 'hoi12'); }); </script>The text was updated successfully, but these errors were encountered: