Thingworx Map Widget - Display only near by Police station in the Map

[Ashritha]

Hi,

I'm using ThingWorx 8.5. I need to display only near by police station in the google map widget based on the vehicle location. The other places should not be highlighted or named. Is this is possible in ThingWorx ? How can it be achieved?

Thank you

Ashritha

[PEHOWE]

@Ashritha, Have you posted this question on the Google Maps API  forum? I did a quick google.com search and found, "Start Styling your Map", https://developers.google.com/maps/documentation/javascript/styling

This seems to be the type of information which you will need to provide to the google map API. 

[slangley]

Hi @Ashritha.

If the response from @PEHOWE allowed you to resolve your issue, please mark it as the Accepted Solution for the benefit of others on the community.

Regards.

--Sharon

[slangley]

Hi @Ashritha.

I have marked the Accepted Solution for this post.  If you disagree that it is the solution, please let me know.

Regards.

--Sharon

[Ashritha]

No, that is not a solution to my question. I tried but I dint reach to the
solution

Thanks and Regards,
Ashritha

[PEHOWE · Accepted solution]

@Ashritha ,

I was looking at another question which involved Google Map API. I agree that the answer I provided was not helpful. I believe that you need to find a Google Map API Style definition which only shows the items you want on your map. 

To help in demonstrating my solution I took the "NightMap" style which is described on the Google Map API site. https://developers.google.com/maps/documentation/javascript/examples/style-array

To use this information will require you to create a custom version of the Google Widget. You will need to update 2 files, googlemap.ide.js and googlemap.runtime.js.

In the googlemap.ide.js you will find the below code. I have added the last value line which adds "NightMode".

'MapSkin': {
     'isBindingTarget': false,
     'description' : 'A few options on the look of the map',
     'baseType': 'STRING',
     'defaultValue': 'normal',
     'selectOptions': [
        { value: 'normal', text: 'Normal' },
        { value: 'blue', text: 'Blue' },
        { value: 'gray', text: 'Gray' },
        { value: 'nitemode', text: 'NiteMode' }
     ]
},

In the googlemap.runtime.js you will find the below code.

switch( thisWidget.getProperty('MapSkin','normal') ) {
    case 'normal':
        break;
    case 'blue':
        options['styles'] = [{"featureType":"water","elementType": <code removed> ];
        break;
    case 'gray':
	options['styles'] = [{"featureType":"landscape","stylers": <code removed> }]}];
        break;
    case 'nitemode':
        options['styles'] = [{elementType: 'geometry', stylers: <code removed> ]}];
	break;
}

I have added a case using the information from Google Map API page. I added the case for 'nightmode'. For the purpose of this posting I have removed some of the code to make it readable.

I hope this information is helpful. Please let me know if you have any questions.

Regards,

Peter

[slangley]

Hi @Ashritha.

If the last post from Peter helped you to find a solution, please mark it as the Accepted Solution for the benefit of others with the same question.

Thank you for your participation in our community!

Regards.

--Sharon