title: How to show marker with the city name - Google Geochart
body: <p>How can I show a name with a marker, currently there is only 1 option to select between "markers" or "text". If I choose the "text" then there is no click option on text click. Is it possible to have both on a map? If not then can we have the click event on a text?</p>
  
  <pre><code>var dataCities = google.visualization.arrayToDataTable([
              ['City', ''],
              ['Lahore', 1],
              ['Karachi', 1],
              ['Islamabad', 1],
              ["Gilgit", 1]
          ]);
  
          var options = {
              region: 'PK',
              displayMode: 'text',
              width: 834,
              height: 521,
              backgroundColor: '#fff',
              datalessRegionColor: '#9bd5e1',
              defaultColor: '#fff',
              legend: 'none',
              showTooltip: true,
              showInfoWindow: true,
              sizeAxis: {
                  minValue: 0,
                  maxValue: 5
              },
  
              colorAxis: {
                  colors: ['#739FA8', '#739FA8', '#739FA8', '#739FA8', '#739FA8']
              }
  
          };
  
  function myClickHandler() {
              var city = '';
              var selection = chart.getSelection();
              if (selection.length &gt; 0) {
                  city = dataCities.og[selection[0].row].c[0].v;
                  //alert(data.getValue(selection[0].row, 0));
                  document.getElementById('location').innerHTML = '';
                  document.getElementById('location').innerHTML = countryCity + ' , ' + city;
              }
          }
          var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
  
          google.visualization.events.addListener(chart, 'select', myClickHandler);
          chart.draw(dataCities, options);
  </code></pre>
  
  <p>Here is the fiddle: <a href="http://jsfiddle.net/svtykw9o/" rel="nofollow noreferrer">jsfiddle</a></p>